@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700;800;900&display=swap");

h1,
h2,
h3,
h4 {
    font-family: "Playfair Display", Georgia, serif !important;
}

/* Fix: header above GSAP ScrollSmoother (#smooth-wrapper is position:fixed) */

body>.main-header.header-style-one.header-1,
.page-wrapper>.main-header.header-style-one.header-1 {
    position: fixed !important;
    top: 24px;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 100000 !important;
    pointer-events: auto;
}

body>.main-header.header-style-one.header-1,
body>.main-header.header-style-one.header-1 > .container,
body>.main-header.header-style-one.header-1 .header-lower,
body>.main-header.header-style-one.header-1 .main-box {
    border: 0 !important;
    border-top: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}

body>.main-header.header-style-one.header-1::before,
body>.main-header.header-style-one.header-1::after,
body>.main-header.header-style-one.header-1 .header-lower::before,
body>.main-header.header-style-one.header-1 .header-lower::after {
    content: none !important;
    display: none !important;
}

/* Scroll state: replace the floating header with a compact black sticky bar. */
body>.main-header.header-style-one.header-1.fixed-header > .container {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

body>.main-header.header-style-one.header-1 > .container {
    transition: opacity 0.25s ease, visibility 0.25s ease;
}

body>.main-header.header-style-one.header-1 > .sticky-header {
    display: block !important;
    top: 0 !important;
    min-height: 110px;
    padding: 18px 0 !important;
    background: rgba(5, 5, 5, 0.97) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2) !important;
    transform: translate3d(0, 0, 0) !important;
    animation: none !important;
    transition: opacity 0.25s ease, visibility 0.25s ease !important;
    z-index: 100001 !important;
}

body>.main-header.header-style-one.header-1 > .sticky-header.fixed-header {
    opacity: 1 !important;
    visibility: visible !important;
}

body>.main-header.header-style-one.header-1 > .sticky-header .inner-container {
    min-height: 74px;
    gap: 40px;
}

body>.main-header.header-style-one.header-1 > .sticky-header .logo {
    flex: 0 0 150px;
    margin: 0 !important;
    padding: 0 !important;
}

body>.main-header.header-style-one.header-1 > .sticky-header .logo img {
    width: 135px;
    max-height: 58px;
}

body>.main-header.header-style-one.header-1 > .sticky-header .nav-outer {
    display: flex;
    flex: 1;
    justify-content: center;
}

body>.main-header.header-style-one.header-1 > .sticky-header .main-menu {
    margin: 0;
}

body>.main-header.header-style-one.header-1 > .sticky-header .main-menu .navigation {
    min-width: 595px;
    justify-content: center;
    padding: 8px 28px !important;
}

@media (max-width: 1199.98px) {
    body>.main-header.header-style-one.header-1.fixed-header > .container {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    body>.main-header.header-style-one.header-1 > .sticky-header {
        display: none !important;
    }
}

@media (max-width: 767.98px) {
    body>.main-header.header-style-one.header-1,
    .page-wrapper>.main-header.header-style-one.header-1 {
        top: 12px;
    }
}

.blog-listing {
            padding: 90px 0 110px;
        }

        .blog-listing__container {
            width: 100%;
            max-width: 1350px;
            margin-right: auto;
            margin-left: auto;
            padding-right: 15px;
            padding-left: 15px;
        }

        .contact-form-style-1 .contact-form-box .form-clt .contact-service-select {
            width: 100%;
            min-height: 52px;
            padding: 0 34px 17px 0;
            color: #fff;
            background-color: transparent;
            background-image:
                linear-gradient(45deg, transparent 50%, currentColor 50%),
                linear-gradient(135deg, currentColor 50%, transparent 50%);
            background-position:
                calc(100% - 11px) 20px,
                calc(100% - 6px) 20px;
            background-repeat: no-repeat;
            background-size: 5px 5px, 5px 5px;
            border: 0;
            border-bottom: 1px solid rgba(255, 255, 255, 0.14);
            border-radius: 0;
            outline: none;
            font-size: 16px;
            font-weight: 400;
            appearance: none;
            cursor: pointer;
        }

        .contact-form-style-1 .contact-form-box .form-clt .contact-service-select option {
            color: #111;
            background: #fff;
        }

        .contact-form-style-1 .contact-form-box .form-clt .nice-select.contact-service-select {
            width: 100%;
            height: 52px;
            padding: 0 34px 17px 0;
            color: #fff;
            background: transparent;
            border: 0;
            border-bottom: 1px solid rgba(255, 255, 255, 0.14);
            line-height: 34px;
        }

        .contact-form-style-1 .contact-form-box .form-clt .nice-select.contact-service-select::after {
            right: 3px;
            border-color: currentColor;
        }

        .contact-form-style-1 .contact-form-box .form-clt .nice-select.contact-service-select .list {
            width: 100%;
            max-height: 260px;
            overflow-y: auto;
            color: #111;
            background: #fff;
        }

        .contact-page .contact-form-box .form-clt .nice-select.contact-service-select {
            color: #000;
            border-bottom-color: rgba(0, 0, 0, 0.14);
        }

        .blog-listing__head {
            max-width: 680px;
            margin: 0 auto 42px;
            text-align: center;
        }

        .blog-listing__eyebrow {
            display: inline-block;
            margin-bottom: 10px;
            color: #e6002d;
            font-size: 14px;
            font-weight: 700;
            letter-spacing: .12em;
            text-transform: uppercase;
        }

        .blog-listing__head h2 {
            margin-bottom: 12px;
            color: #111;
            font-size: clamp(32px, 4vw, 48px);
            line-height: 1.12;
        }

        .blog-listing__head p {
            margin: 0;
            color: #666;
            font-size: 17px;
            line-height: 1.7;
        }

        .blog-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 28px;
        }

        .blog-carousel.swiper {
            display: block;
            overflow: hidden;
            padding: 8px 4px 52px;
        }

        .blog-carousel .swiper-wrapper {
            align-items: stretch;
            transition-timing-function: linear !important;
        }

        .blog-carousel .swiper-slide {
            height: auto;
        }

        .blog-carousel .blog-card {
            display: flex;
            flex-direction: column;
        }

        .blog-carousel .blog-card__body {
            flex: 1;
        }

        .blog-card {
            overflow: hidden;
            height: 100%;
            background: #fff;
            border: 1px solid #e9e9e9;
            border-radius: 18px;
            box-shadow: 0 10px 35px rgba(20, 20, 20, .06);
            transition: transform .3s ease, box-shadow .3s ease;
        }

        .blog-card:hover {
            transform: translateY(-7px);
            box-shadow: 0 18px 45px rgba(20, 20, 20, .12);
        }

        .blog-card__image {
            position: relative;
            display: block;
            width: 100%;
            height: 300px;
            overflow: hidden;
            background: #ddd;
        }

        .blog-card__image img {
            display: block;
            width: 100%;
            height: 300px;
       
            object-position: center;
            transition: transform .5s ease;
        }

        .blog-card:hover .blog-card__image img {
            transform: scale(1.05);
        }

        .blog-card__date {
            position: absolute;
            top: 16px;
            left: 16px;
            min-width: 52px;
            padding: 9px 10px;
            color: #111;
            background: rgba(255, 255, 255, .94);
            border-radius: 12px;
            font-size: 14px;
            font-weight: 700;
            line-height: 1.1;
            text-align: center;
            box-shadow: 0 6px 20px rgba(0, 0, 0, .1);
        }

        .blog-card__date span {
            display: block;
            color: #e6002d;
            font-size: 20px;
        }

        .blog-card__body {
            display: flex;
            flex-direction: column;
            min-height: 230px;
            padding: 26px;
        }

        .blog-card__category {
            margin-bottom: 10px;
            color: #e6002d;
            font-size: 14px;
            font-weight: 700;
        }

        .blog-card__title {
            margin: 0 0 14px;
            color: #151515;
            font-size: 22px;
            line-height: 1.35;
        }

        .blog-card__title a {
            color: inherit;
        }


        .blog-card__text {
            margin: 0 0 22px;
            color: #6a6a6a;
            font-size: 15px;
            line-height: 1.65;
        }

        .blog-card__link {
            display: inline-flex;
            align-items: center;
            gap: 9px;
            width: fit-content;
            margin-top: auto;
            color: #111;
            font-size: 15px;
            font-weight: 700;
        }

        .blog-card__link:hover {
            color: #e6002d;
        }

        .blog-card__link span {
            transition: transform .25s ease;
        }

        .blog-card__link:hover span {
            transform: translateX(4px);
        }

        .blog-card[hidden] {
            display: none !important;
        }

        .blog-pagination {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
            gap: 10px;
            margin-top: 48px;
        }

        .blog-pagination__button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 44px;
            height: 44px;
            padding: 0 15px;
            color: #151515;
            background: #fff;
            border: 1px solid #dedede;
            border-radius: 10px;
            font-size: 15px;
            font-weight: 700;
            line-height: 1;
            cursor: pointer;
            transition: color .25s ease, background-color .25s ease, border-color .25s ease;
        }

        .blog-pagination__button:hover,
        .blog-pagination__button.is-active {
            color: #fff;
            background: #e6002d;
            border-color: #e6002d;
        }

        .blog-pagination__button:disabled {
            color: #aaa;
            background: #f2f2f2;
            border-color: #e5e5e5;
            cursor: not-allowed;
        }

        @media (max-width: 991.98px) {
            .blog-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 767.98px) {
            .blog-listing {
                padding: 65px 0 80px;
            }

            .blog-listing__head {
                margin-bottom: 30px;
            }

            .blog-grid {
                grid-template-columns: 1fr;
                gap: 22px;
            }

            .blog-card__body {
                min-height: auto;
                padding: 22px;
            }

            .blog-card__title {
                font-size: 20px;
            }

            .blog-pagination {
                gap: 8px;
                margin-top: 36px;
            }

            .blog-pagination__button {
                min-width: 40px;
                height: 40px;
                padding: 0 12px;
                font-size: 14px;
            }
        }
/* SEO client results */

.seo-results-section {
    position: relative;
    overflow: hidden;
    padding: 50px 0px;
}

.seo-results-head {
    max-width: 42rem;
    margin: 0 auto 2.75rem;
    position: relative;
    z-index: 1;
}

.seo-results-lead {
    margin: 0.6rem auto 0;
    color: #666;
    font-size: 1rem;
    line-height: 1.7;
}

.seo-results-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}

.seo-result-card {
    position: relative;
    overflow: hidden;
    min-height: 100%;
    padding: 0.7rem;
    border: 1px solid rgba(18, 18, 18, 0.08);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 18px 52px rgba(26, 31, 44, 0.08);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.seo-result-card::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0;
    background: linear-gradient(135deg, rgba(239, 35, 60, 0.14), rgba(255, 68, 88, 0.08));
    transition: opacity 0.25s ease;
}

.seo-result-card:hover {
    transform: translateY(-7px);
    border-color: rgba(239, 35, 60, 0.42);
    /* box-shadow: 0 24px 70px rgba(239, 35, 60, 0.14); */
}

.seo-result-card:hover::before {
    opacity: 1;
}

.seo-result-media {
    position: relative;
    overflow: hidden;
    border-radius: 13px;
    background: #fff;
}

.seo-result-media img {
    display: block;
    width: 100%;
    aspect-ratio: 680 / 300;
    height: 100%;
    object-fit: cover;
}

@media (min-width: 768px) {
    .seo-results-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1200px) {
    .seo-results-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.35rem;
    }
    .seo-result-card {
        grid-column: auto;
    }
}

@media (max-width: 575.98px) {
    .seo-result-card {
        padding: 0.5rem;
        border-radius: 14px;
    }
    .seo-result-media img {
        aspect-ratio: 680 / 340;
    }
}


/* SEO need company section */

.seo-need-section {
    position: relative;
    overflow: hidden;
    padding: 50px 0px;
}

.seo-need-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background-size: 44px 44px;
    pointer-events: none;
}

.seo-need-head {
    position: relative;
    z-index: 1;
    max-width: 58rem;
    margin: 0 auto 2.75rem;
}

.seo-need-head p {
    max-width: 52rem;
    margin: 0.75rem auto 0;
    color: #5d6878;
    font-size: 1rem;
    line-height: 1.75;
}

.seo-need-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    align-items: stretch;
}

.seo-need-card {
    position: relative;
    min-height: 210px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 1.55rem 1.35rem 1.35rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(252, 253, 255, 0.96)), #fff;
    box-shadow: 0 14px 38px rgba(15, 23, 42, 0.055);
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}

.seo-need-card::before {
    content: "";
    position: absolute;
    left: 1.5rem;
    right: 1.5rem;
    top: 0;
    height: 3px;
    opacity: 0;
    border-radius: 999px;
    background: #ef233c;
    transition: opacity 0.25s ease, transform 0.25s ease;
    transform: scaleX(0.45);
}

.seo-need-card:hover {
    transform: translateY(-6px);
    border-color: rgba(15, 23, 42, 0.15);
    background: #fff;
    box-shadow: 0 24px 62px rgba(15, 23, 42, 0.11);
}

.seo-need-card:hover::before {
    opacity: 1;
    transform: scaleX(1);
}

.seo-need-card--feature {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.96)), #fff;
}

.seo-need-card--highlight {
    border-color: rgba(239, 35, 60, 0.22);
    box-shadow: 0 22px 54px rgba(15, 23, 42, 0.095);
}

.seo-need-card--highlight::before {
    opacity: 1;
    transform: scaleX(1);
}

.seo-need-card--highlight .seo-need-icon {
    color: #ef233c;
    border-color: rgba(239, 35, 60, 0.2);
    background: rgba(239, 35, 60, 0.06);
}

.seo-need-icon {
    position: relative;
    z-index: 1;
    width: 48px;
    height: 48px;
    display: inline-grid;
    place-items: center;
    margin-bottom: 1.25rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    color: #111827;
    background: #f8fafc;
    box-shadow: inset 0 -1px 0 rgba(15, 23, 42, 0.05);
    transition: color 0.25s ease, background 0.25s ease, border-color 0.25s ease;
}

.seo-need-icon svg {
    width: 24px;
    height: 24px;
}

.seo-need-card:hover .seo-need-icon {
    color: #ef233c;
    border-color: rgba(239, 35, 60, 0.18);
    background: rgba(239, 35, 60, 0.055);
}

.seo-need-number {
    position: absolute;
    top: 1.2rem;
    right: 1.35rem;
    color: rgba(15, 23, 42, 0.075);
    font-size: 3rem;
    font-weight: 800;
    line-height: 1;
}

.seo-need-card h3,
.seo-need-card p {
    position: relative;
    z-index: 1;
}

.seo-need-card h3 {
    margin: 0 0 0.8rem;
    color: #0f172a;
    font-size: 21px;
    line-height: 1.35;
}

.seo-need-card p {
    margin: 0;
    color: #5f6b7c;
    font-size: 0.9rem;
    line-height: 1.7;
}

@media (min-width: 768px) {
    .seo-need-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.1rem;
    }
}

@media (min-width: 992px) {
    .seo-need-grid {
        grid-template-columns: repeat(6, 1fr);
        gap: 1.15rem;
    }
    .seo-need-card {
        min-height: 220px;
    }
    .seo-need-card:nth-child(1),
    .seo-need-card:nth-child(2),
    .seo-need-card:nth-child(6),
    .seo-need-card:nth-child(7) {
        grid-column: span 3;
    }
    .seo-need-card:nth-child(3),
    .seo-need-card:nth-child(4),
    .seo-need-card:nth-child(5) {
        grid-column: span 2;
    }
}


/* SEO tools carousel */

.seo-tools-section {
    position: relative;
    overflow: hidden;
    padding: 20px 0px;
}

.seo-tools-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background-size: 42px 42px;
    pointer-events: none;
}

.seo-tools-shell {
    position: relative;
    z-index: 1;
}

.seo-tools-copy {
    max-width: 58rem;
    margin: 0 auto 2.4rem;
    text-align: center;
}

.seo-tools-copy .title {
    margin-bottom: 1rem;
}

.seo-tools-copy p {
    max-width: 55rem;
    margin: 0 auto;
    color: #5d6878;
    font-size: 1rem;
    line-height: 1.75;
}

.seo-tools-carousel-wrap {
    position: relative;
    min-width: 0;
    padding: 0;
}

.seo-tools-slider {
    position: relative;
    z-index: 1;
    padding: 0.6rem 0;
}

.seo-tool-card {
    position: relative;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 1.15rem;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    background: #fff;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.seo-tool-card:hover {
    transform: translateY(-8px);
}

.seo-tool-card img {
    width: 100%;
    height: 240px;
    object-fit: contain;
    border-radius: 14px;
    background: #fff;
}

.seo-tool-card a {
    display: block;
    text-decoration: none;
    cursor: zoom-in;
}

@media (max-width: 767.98px) {
    .seo-tool-card {
        min-height: 218px;
    }
}


/* SEO activities, process, and case studies */

.seo-activities-section,
.seo-process-section,
.seo-case-section {
    position: relative;
    overflow: hidden;
    padding: 30px 0px;
}

.seo-activities-section::before,
.seo-process-section::before,
.seo-case-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background-size: 44px 44px;
    pointer-events: none;
}

.seo-activities-head,
.seo-process-head,
.seo-case-head {
    position: relative;
    z-index: 1;
    max-width: 64rem;
    margin: 0 auto 2.6rem;
}

.seo-activities-head p,
.seo-process-head p {
    max-width: 58rem;
    margin: 1rem auto 0;
    color: #5d6878;
    font-size: 0.98rem;
    line-height: 1.75;
}

.seo-activities-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.seo-activity-card {
    position: relative;
    overflow: hidden;
    min-height: 235px;
    padding: 1.35rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 16px 44px rgba(15, 23, 42, 0.06);
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.seo-activity-card::before {
    content: "";
    position: absolute;
    inset: auto -28% -45% auto;
    width: 9rem;
    height: 9rem;
    border-radius: 50%;
    background: rgba(230, 0, 35, 0.08);
    transition: transform 0.25s ease;
}

.seo-activity-card::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(180deg, #e60023, rgba(230, 0, 35, 0));
    opacity: 0;
    transition: opacity 0.25s ease;
}

.seo-activity-card:hover {
    transform: translateY(-7px);
    border-color: rgba(230, 0, 35, 0.18);
    box-shadow: 0 26px 62px rgba(15, 23, 42, 0.11);
}

.seo-activity-card:hover::before {
    transform: scale(1.2);
}

.seo-activity-card:hover::after {
    opacity: 1;
}

.seo-activity-icon {
    position: relative;
    z-index: 1;
    width: 48px;
    height: 48px;
    display: inline-grid;
    place-items: center;
    margin-bottom: 1rem;
    border: 1px solid rgba(230, 0, 35, 0.16);
    border-radius: 14px;
    color: #e60023;
    background: rgba(230, 0, 35, 0.055);
}

.seo-activity-icon svg {
    width: 24px;
    height: 24px;
}

.seo-activity-card h3,
.seo-activity-card p {
    position: relative;
    z-index: 1;
}

.seo-activity-card h3 {
    margin: 0 0 0.75rem;
    color: #0f172a;
    font-size: 18px;
    line-height: 1.3;
}

.seo-activity-card p {
    margin: 0;
    color: #383838;
    font-size: 0.88rem;
    line-height: 1.68;
}

.seo-process-flow {
    position: relative;
    z-index: 1;
    max-width: 990px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.05rem;
    margin: 0 auto;
    padding: 0.25rem 0;
}

.seo-process-flow::before {
    content: "";
    position: absolute;
    left: 1.55rem;
    top: 2rem;
    bottom: 2rem;
    width: 2px;
    background: linear-gradient(180deg, rgba(230, 0, 35, 0), rgba(230, 0, 35, 0.58), rgba(230, 0, 35, 0));
}

.seo-process-step {
    position: relative;
    min-height: 82px;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.45rem 1rem 4.25rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.065);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.seo-process-step:hover {
    transform: translateY(-5px);
    border-color: rgba(230, 0, 35, 0.16);
    box-shadow: 0 28px 62px rgba(15, 23, 42, 0.1);
}

.seo-process-step span {
    position: absolute;
    left: 0.74rem;
    top: 50%;
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: #000;
    font-size: 0.75rem;
    font-weight: 850;
    transform: translateY(-50%);
}

.seo-process-step h3 {
    margin: 0;
    color: #0f172a;
    font-size: 0.95rem;
    line-height: 1.3;
}

.seo-case-section::before {
    background-size: 70px 70px, 44px 44px;
}

.seo-case-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.2rem;
    max-width: 900px;
    margin: 0 auto;
}

.seo-case-card {
    position: relative;
    overflow: hidden;
    min-height: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.085);
    text-align: center;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.seo-case-card::before {
    content: "";
    position: absolute;
    inset: auto -6rem -4rem auto;
    width: 18rem;
    height: 10rem;
    opacity: 0.18;
    background: linear-gradient(135deg, transparent 48%, #e60023 49%, transparent 51%), linear-gradient(25deg, transparent 48%, #0f172a 49%, transparent 51%);
    background-size: 4rem 4rem;
    transform: rotate(-8deg);
}

.seo-case-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 34px 88px rgba(15, 23, 42, 0.13);
}

.seo-case-logo {
    position: relative;
    z-index: 1;
    width: 180px;
    height: 120px;
    display: grid;
    place-items: center;
    margin-bottom: 1.1rem;
}

.seo-case-logo img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.seo-case-card h3 {
    position: relative;
    z-index: 1;
    margin: 20px 20px;
    color: #0f172a;
    font-size: 20px !important;
}

.seo-case-card a {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0.75rem 1.2rem;
    border-radius: 999px;
    color: #fff;
    background: #e60023;
    font-size: 0.86rem;
    font-weight: 850;
    box-shadow: 0 14px 34px rgba(230, 0, 35, 0.24);
}

@media (min-width: 768px) {
    .seo-activities-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .seo-process-flow {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem 5.2rem;
        padding: 0.35rem 0 0;
    }
    .seo-process-flow::before {
        left: 50%;
        top: 2.4rem;
        bottom: 4.4rem;
        transform: translateX(-50%);
    }
    .seo-process-step:nth-child(odd) {
        grid-column: 1;
        width: 100%;
        justify-self: stretch;
    }
    .seo-process-step:nth-child(even) {
        grid-column: 2;
        width: 100%;
        justify-self: stretch;
    }
    .seo-process-step:nth-child(7) {
        grid-column: 1 / -1;
        width: min(430px, 100%);
        max-width: none;
        justify-self: center;
        min-height: 68px;
        margin-top: -0.1rem;
        padding-right: 1.2rem;
    }
    .seo-case-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1200px) {
    .seo-activities-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

#smooth-wrapper {
    position: relative;
    z-index: 1 !important;
}

.page-wrapper:has(#smooth-wrapper) {
    z-index: 1;
}

.hero-section.hero-1 {
    padding-top: 200px !important;
}

@media (max-width: 767.98px) {
    .hero-section.hero-1 {
        padding-top: 108px !important;
    }
}

.header-1 .ui-btn-outer .search-btn {
    display: none !important;
}


/* Mobile menu — Gencyo theme layout (banner.css must not style this) */

.mobile-menu .navigation {
    display: block !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.mobile-menu .navigation>li {
    display: block !important;
    width: 100% !important;
}

.mobile-menu .navigation>li>a,
.mobile-menu .navigation li ul li a {
    color: #ffffff !important;
    display: block !important;
    padding: 10px 20px !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    text-transform: capitalize !important;
}

.mobile-menu .navigation>li>a::after,
.mobile-menu .navigation li ul li a::after {
    display: none !important;
    content: none !important;
}

.mobile-menu .navigation li ul {
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.mobile-menu .navigation li:hover>a,
.mobile-menu .navigation li.current>a {
    color: var(--theme-color1, #e60023) !important;
}

.mobile-menu-visible {
    overflow: hidden !important;
}

.mobile-menu-visible .mouseCursor,
.mobile-menu-visible #back-top {
    z-index: 1 !important;
}

.saar-footer {
    position: relative;
    overflow: hidden;
    background: none;
    color: #d6d6d6;
}

.saar-footer::before,
.saar-footer::after {
    content: "";
    position: absolute;
    inset: -12% auto -18% 54%;
    width: 18%;
    transform: skewX(-34deg);
    background: rgba(255, 255, 255, 0.025);
    pointer-events: none;
}

.saar-footer::after {
    left: 72%;
    width: 14%;
    background: rgba(0, 0, 0, 0.18);
}

.saar-footer__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
    padding: 88px 0 26px;
}

.saar-footer__main {
    display: grid;
    grid-template-columns: 0.82fr 1.18fr;
    align-items: center;
    gap: 72px;
    padding-bottom: 76px;
}

.saar-footer__copy {
    max-width: 420px;
}

.saar-footer__logo {
    display: inline-block;
    margin-bottom: 34px;
}

.saar-footer__logo img {
    display: block;
    width: 132px;
    max-height: 82px;
    object-fit: contain;
}

.saar-footer__intro {
    margin: 0 0 26px;
    color: #c7c7c7;
    font-size: 21px;
    line-height: 1.55;
    font-weight: 400;
}

.saar-footer__contact {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.saar-footer__contact-row {
    display: grid;
    grid-template-columns: 86px 1fr;
    gap: 22px;
    padding: 15px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.saar-footer__contact-row span {
    color: #858585;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.saar-footer__contact-row a,
.saar-footer__contact-row address {
    margin: 0;
    color: #e0e0e0;
    font-size: 16px;
    line-height: 1.45;
    font-style: normal;
    font-weight: 400;
}

.saar-footer__contact-row a:hover {
    color: #ffffff;
}

.saar-footer__social {
    display: flex;
    gap: 10px;
    margin-top: 28px;
}

.saar-footer__social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    color: #eeeeee;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.015);
}

.saar-footer__social a:hover {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.35);
}

.saar-footer__media {
    position: relative;
    min-height: 440px;
}

.saar-footer__rule {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #e60023;
}

.saar-footer__rule--one {
    left: 6%;
}

.saar-footer__rule--two {
    left: 15%;
}

.saar-footer__image {
    position: absolute;
    overflow: hidden;
    filter: grayscale(1);
    box-shadow: 0 30px 68px rgba(0, 0, 0, 0.32);
}

.saar-footer__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.saar-footer__image--small {
    left: 5%;
    bottom: 14px;
    z-index: 2;
    width: 36%;
    height: 300px;
    border-radius: 0 0 42px 42px;
}

.saar-footer__image--large {
    right: 0;
    top: 42px;
    width: 68%;
    height: 386px;
    border-radius: 0 0 54px 0;
}

.saar-footer__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.saar-footer__bottom p {
    margin: 0;
    color: #a8a8a8;
    font-size: 16px;
    font-weight: 400;
}

.saar-footer__bottom strong {
    color: #e6e6e6;
}

.saar-footer__top {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}


/* Portfolio Carousel Section */

.portfolio-carousel-section {
    padding-bottom: 50px;
    overflow: hidden;
}

.portfolio-slider {
    padding: 20px 0 60px !important;
    overflow: visible !important;
    transition: opacity 0.2s ease;
}

.portfolio-slider:not(.swiper-initialized) {
    visibility: hidden;
    opacity: 0;
    overflow: hidden !important;
}

.portfolio-slider.swiper-initialized {
    visibility: visible;
    opacity: 1;
}

.carousel-image-popup img {
    cursor: zoom-in;
}

.portfolio-slider .swiper-wrapper {
    transition-timing-function: linear !important;
}

.portfolio-card {
    position: relative;
    border-radius: 40px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 15px 45px rgba(0, 0, 0, 0.08);
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.portfolio-image {
    position: relative;
    aspect-ratio: 1/1;
    overflow: hidden;
}

.portfolio-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.portfolio-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 55px rgba(0, 0, 0, 0.12);
}

.portfolio-card:hover .portfolio-image img {
    transform: scale(1.05);
}


/* Case study project grid */

.travelit-dest-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-auto-rows: 268px;
    gap: 16px;
    align-items: stretch;
}

.travelit-dest-card {
    position: relative;
    overflow: hidden;
    min-width: 0;
    border-radius: 14px;
    background: #111;
    isolation: isolate;
}

.travelit-dest-card.dest-card-1 {
    grid-row: span 2;
}

.travelit-dest-img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover !important;
    object-position: center;
    filter: grayscale(100%);
    transition: transform 0.45s ease, filter 0.35s ease;
}

.travelit-dest-card:hover .travelit-dest-img {
    transform: scale(1.04);
    filter: grayscale(0%);
}

.travelit-dest-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: flex-end;
    padding: 24px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.04) 0%, rgba(0, 0, 0, 0.22) 42%, rgba(0, 0, 0, 0.76) 100%);
    z-index: 1;
}


/* .travelit-dest-content {
    max-width: 92%;
} */

.travelit-dest-content h4,
.travelit-dest-content p {
    color: #fff;
}

.travelit-dest-content h4 {
    margin-bottom: 6px;
    font-size: clamp(1.25rem, 2vw, 1.7rem);
    line-height: 1.15;
}

.travelit-dest-content p {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.45;
}

@media (max-width: 991.98px) {
    .travelit-dest-grid {
        grid-template-columns: 1fr;
        grid-auto-rows: auto;
    }
    .travelit-dest-card,
    .travelit-dest-card.dest-card-1 {
        grid-row: auto;
        aspect-ratio: 16 / 10;
    }
}

@media (max-width: 1199.98px) {
    .project-section .sec-title .row {
        row-gap: 18px;
    }
    .project-section .sec-title .title {
        max-width: 720px;
        font-size: clamp(2rem, 6vw, 3.1rem);
        line-height: 1.12;
    }
    .project-section .mynewbutton {
        margin-top: 0;
    }
    .travelit-dest-grid {
        grid-template-columns: 1fr;
        grid-auto-rows: auto;
        gap: 18px;
    }
    .travelit-dest-card,
    .travelit-dest-card.dest-card-1 {
        grid-row: auto;
        aspect-ratio: 16 / 9;
    }
}

@media (max-width: 575.98px) {
    .project-section.section-padding {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .project-section .sec-title .row > .text-right {
        display: flex;
        justify-content: center;
        text-align: center !important;
    }
    .project-section .sec-title .row > .text-left {
        text-align: center !important;
    }
    .project-section .sec-title .sub-title {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .project-section .sec-title {
        margin-bottom: 28px;
    }
    .project-section .sec-title .title {
        font-size: clamp(1.9rem, 10vw, 2.65rem);
    }
    .project-section .mynewbutton {
        min-width: 180px;
        min-height: 44px;
        font-size: 13px;
    }
    .travelit-dest-grid {
        gap: 14px;
    }
    .travelit-dest-card,
    .travelit-dest-card.dest-card-1 {
        aspect-ratio: 1 / 0;
        border-radius: 12px;
    }
    .travelit-dest-overlay {
        padding: 18px;
    }
    .travelit-dest-content {
        max-width: 100%;
    }
    .travelit-dest-content h4 {
        font-size: 1.2rem;
    }
    .travelit-dest-content p {
        display: none;
    }
}

.hero-btn-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 25px;
    margin-top: 20px;
    width: 100%;
}

.scroll-down-icon {
    margin-left: 0;
    animation: scrollDownFloat 2s infinite ease-in-out;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.mouse-scroll {
    width: 26px;
    height: 42px;
    border: 2px solid #e60023;
    border-radius: 15px;
    position: relative;
}

.mouse-scroll::before {
    content: '';
    width: 2px;
    height: 6px;
    background-color: #e60023;
    position: absolute;
    left: 50%;
    top: 8px;
    transform: translateX(-50%);
    border-radius: 2px;
    animation: mouseWheel 1.5s infinite;
}

@keyframes mouseWheel {
    0% {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateX(-50%) translateY(10px);
    }
}

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

.scroll-arrow-down {
    width: 10px;
    height: 10px;
    border-right: 2px solid #e60023;
    border-bottom: 2px solid #e60023;
    transform: rotate(45deg);
}


/* Custom New Button Style */


/* Flip buttons — hero Discover More + mynewbutton */

.hero-btn-wrapper .contact-btn.btn-flip,
.mynewbutton {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    overflow: hidden !important;
    perspective: 1000px;
    min-width: 168px;
    height: 52px;
    padding: 0 !important;
    background: transparent !important;
    border: 1px solid #e60023 !important;
    border-radius: 50px !important;
    color: transparent !important;
    cursor: pointer;
    text-decoration: none !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-transform: capitalize !important;
    box-shadow: none !important;
    transition: border-color 0.3s ease !important;
}

.hero-btn-wrapper .contact-btn.btn-flip::before,
.hero-btn-wrapper .contact-btn.btn-flip::after,
.mynewbutton::before,
.mynewbutton::after {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    transition: 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
    font-weight: 600;
    font-size: 16px;
    text-transform: capitalize;
    letter-spacing: 0.02em;
    box-sizing: border-box;
}

.mynewbutton::before {
    background: #f6f6f600 !important;
}

.mynewbutton::before {
    content: attr(data-front);
    background: #f6f6f6;
    color: #151515 !important;
    border: 1px solid #e60023;
    transform: translateY(0) rotateX(0);
    opacity: 1;
    z-index: 2;
}

.contact-button .mynewbutton::before {
    color: #fff;
}

.home .hero-btn-wrapper .contact-btn.btn-flip::before {
    background: #f6f6f600 !important;
    color: #e60023 !important;
}

.hero-btn-wrapper .contact-btn.btn-flip::after,
.mynewbutton::after {
    content: attr(data-back);
    background: #e60023;
    color: #ffffff !important;
    border: 1px solid #e60023;
    transform: translateY(-100%) rotateX(90deg);
    opacity: 0;
    z-index: 1;
}

.hero-btn-wrapper .contact-btn.btn-flip:hover::before,
.mynewbutton:hover::before {
    transform: translateY(100%) rotateX(-90deg);
    opacity: 0;
}

.hero-btn-wrapper .contact-btn.btn-flip:hover::after,
.mynewbutton:hover::after {
    transform: translateY(0) rotateX(0);
    opacity: 1;
}

.hero-btn-wrapper .contact-btn.btn-flip:hover,
.mynewbutton:hover {
    transform: none !important;
    background: transparent !important;
    box-shadow: 0 10px 24px rgba(230, 0, 35, 0.2) !important;
}

.hero-btn-wrapper .contact-btn.btn-flip[data-front]>*,
.mynewbutton[data-front]>* {
    opacity: 0 !important;
    visibility: hidden !important;
}


/* Header Let's Talk — flip CTA */

.main-header .contact-btn {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    overflow: hidden !important;
    perspective: 1000px;
    min-width: 132px;
    height: 45px;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 50px !important;
    color: transparent !important;
    cursor: pointer;
    text-decoration: none !important;
    box-shadow: none !important;
}

.main-header .contact-btn::before,
.main-header .contact-btn::after {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    transition: 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    box-sizing: border-box;
}

.main-header .contact-btn::before {
    content: attr(data-front);
    background: #e60023;
    color: #ffffff !important;
    transform: translateY(0) rotateX(0);
    opacity: 1;
    z-index: 2;
}

.main-header .contact-btn::after {
    content: attr(data-back);
    background: #ffffff;
    color: #e60023 !important;
    transform: translateY(-100%) rotateX(90deg);
    opacity: 0;
    z-index: 1;
}

.main-header .contact-btn:hover::before {
    transform: translateY(100%) rotateX(-90deg);
    opacity: 0;
}

.main-header .contact-btn:hover::after {
    transform: translateY(0) rotateX(0);
    opacity: 1;
}

.main-header .contact-btn:hover {
    background: transparent !important;
    color: transparent !important;
}

.main-header .contact-btn[data-front]>* {
    opacity: 0 !important;
    visibility: hidden !important;
}


/* Video Parallax Section */

.video-parallax-section {
    position: relative;
    padding: 150px 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    /* Simple Parallax */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.video-parallax-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1;
}

.video-parallax-content {
    position: relative;
    z-index: 2;
}

.video-parallax-content h2 {
    color: #fff;
}

.video-play-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 90px;
    height: 90px;
    background-color: #e60023;
    color: #fff !important;
    border-radius: 50%;
    font-size: 24px;
    transition: all 0.5s ease;
    box-shadow: 0 0 0 0 rgba(230, 0, 35, 0.5);
    animation: pulseRed 2s infinite;
    margin-top: 20px;
}

.video-play-btn:hover {
    transform: scale(1.1);
    background-color: #fff;
    color: #e60023 !important;
}

@keyframes pulseRed {
    0% {
        box-shadow: 0 0 0 0 rgba(230, 0, 35, 0.7);
    }
    70% {
        box-shadow: 0 0 0 25px rgba(230, 0, 35, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(230, 0, 35, 0);
    }
}


/* Ultra Minimal Counter Section */

.minimal-counter-section {
    background-color: transparent;
    padding: 80px 0;
    position: relative;
}

.minimal-counter-section::before {
    display: none;
}

.counter-item-minimal {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 15px;
}

.counter-icon-box {
    font-size: 24px;
    color: #e60023;
    opacity: 0.8;
}

.counter-number {
    font-size: 42px;
    font-weight: inherit;
    color: #151515;
    line-height: 1;
    margin: 0;
}

.counter-label {
    font-size: 13px;
    color: #777777;
    font-weight: inherit;
    text-transform: uppercase;
    letter-spacing: 1px;
}

@media (max-width: 991px) {
    .counter-item-minimal {
        justify-content: center;
        margin-bottom: 30px;
    }
}


/* Premium Features Overview Section - Exact Match to Reference */

.premium-features-section {
    background-color: #ffffff;
    padding: 100px 0;
    position: relative;
    overflow: hidden;
    font-family: 'Inter', sans-serif;
}

.features-badge-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
}

.features-badge {
    background: #fff;
    border: 1px solid #eee;
    padding: 6px 18px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 600;
    color: #1a1a1a;
    /* Darker text like image */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02);
    display: flex;
    align-items: center;
    gap: 8px;
}

.features-badge::before {
    content: '';
    width: 6px;
    height: 6px;
    background: #e60023;
    border-radius: 50%;
}

.premium-features-title {
    font-size: clamp(32px, 5vw, 64px);
    /* Larger like image */
    font-weight: 800;
    text-align: center;
    color: #1a1a1a;
    margin-bottom: 80px;
    letter-spacing: -1px;
}

.features-grid-container {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 650px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 0;
}


/* Feature Cards Styling */

.feature-column {
    display: flex;
    flex-direction: column;
    gap: 30px;
    /* Tighter gap like image */
    width: 340px;
    z-index: 2;
}

.premium-feature-card {
    background: #ffffff;
    border: 1px solid #f2f2f2;
    border-radius: 24px;
    padding: 40px 30px 30px;
    /* More padding like image */
    box-shadow: 0 15px 45px rgba(0, 0, 0, 0.03);
    transition: all 0.4s ease;
    position: relative;
}

.f-icon-box {
    width: 44px;
    /* Slightly larger icon box */
    height: 44px;
    background: #1a1a1a;
    border-radius: 12px;
    /* Rounded square like image */
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 16px;
    position: absolute;
    top: -22px;
    left: 30px;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
}

.premium-feature-card h4 {
    font-size: 20px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 15px;
    line-height: 1.2;
}

.premium-feature-card p {
    font-size: 14px;
    line-height: 1.6;
    color: #888;
    margin: 0;
    font-weight: 400;
}


/* Center Card Styling */

.center-card-wrapper {
    position: relative;
    width: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3;
}

.premium-center-card {
    width: 150px;
    height: 100px;
    /* Rectangular rounded like image */
    background: #000000;
    /* Red background */
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
    position: relative;
    box-shadow: 0 15px 35px rgba(230, 0, 35, 0.4);
    cursor: pointer;
    transition: all 0.3s ease;
    border: none;
    z-index: 2;
}

.center-glow-effect {
    position: absolute;
    width: 180px;
    height: 130px;
    filter: blur(35px);
    border-radius: 50%;
    opacity: 0.6;
    z-index: 1;
}

@keyframes centerPulseGlow {
    0% {
        transform: scale(0.9);
        opacity: 0.4;
    }
    100% {
        transform: scale(1.1);
        opacity: 0.7;
    }
}

.features-connectors {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
}

.connector-path {
    fill: none;
    stroke: #e6e6e6;
    /* Light gray for static lines */
    stroke-width: 1.2px;
}

.center-logo-box {
    width: 110px;
    /* Increased size as requested */
    margin-bottom: 5px;
    line-height: 1;
}

.center-logo-box img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.center-brand-name {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: #fff;
    text-transform: uppercase;
}


/* Premium Nexro-Style Stats Section */

.premium-stats-section {
    background: transparent;
    padding-top: 20px;
    position: relative;
    overflow: hidden;
    color: #000000;
}

.ambient-glow {
    display: none;
}

.ambient-glow-1 {
    top: -10%;
    left: -10%;
    background: radial-gradient(circle, #e60023 0%, transparent 70%);
}

.ambient-glow-2 {
    bottom: -10%;
    right: -10%;
    background: radial-gradient(circle, #ff4d4d 0%, transparent 70%);
}


/* Nexro-Style Testimonial Section */


/* ── Minimal Testimonials ── */

.testi-section {
    padding: 20px 0;
}

.testi-slider {
    padding: 30px 10px 70px;
    position: relative;
}

.testi-slider .swiper-slide {
    height: auto;
    display: flex;
}

.testi-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 20px;
    padding: 32px 28px;
    text-align: left;
    width: 100%;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

.testi-avatar {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: #e60023;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 16px;
}

.testi-quote {
    text-align: left !important;
    font-size: 16px;
    line-height: 1.7;
    color: #555;
    margin: 0 0 20px;
    font-style: italic;
}

.testi-author strong {
    display: block;
    font-size: 16px;
    color: #111;
    margin-bottom: 2px;
}

.testi-author span {
    font-size: 13px;
    color: #999;
}

.testi-stars {
    margin-top: 12px;
    display: flex;
    justify-content: center;
    gap: 3px;
    color: #f5a623;
    font-size: 14px;
}

.testi-stars .inactive {
    color: #ddd;
}

.testi-nav {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 12px;
    z-index: 10;
}

.testi-nav button {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #e0e0e0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #333;
    cursor: pointer;
    transition: all .25s ease;
}

.testi-nav button:hover {
    border-color: #e60023;
    color: #e60023;
}


/* opacity: 0;
transform: translateY(20px);

} */

.stats-title {
    font-size: clamp(36px, 5vw, 56px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -1.5px;
    color: #ffffff;
    opacity: 0;
    transform: translateY(30px);
}

.stats-cards-wrapper {
    position: relative;
    z-index: 2;
}

.nexro-stat-card {
    position: relative;
    height: 100%;
    opacity: 0;
    transform: translateY(40px) scale(0.95);
    filter: blur(10px);
    transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.card-inner {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 32px;
    padding: 50px 40px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    overflow: hidden;
    transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.nexro-stat-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 32px;
    padding: 1px;
    background: linear-gradient(135deg, rgba(230, 0, 35, 0.15), transparent 50%, rgba(230, 0, 35, 0.08));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: 1;
}

.nexro-stat-card:hover .card-inner {
    background: #ffffff;
    border-color: rgba(230, 0, 35, 0.3);
    transform: translateY(-10px) scale(1.02);
}

.stat-label {
    font-size: 11px;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.55);
    letter-spacing: 1.5px;
    margin-bottom: 12px;
    text-transform: uppercase;
}

.number-wrap {
    display: flex;
    align-items: baseline;
    gap: 2px;
}

.stat-number {
    font-size: 48px;
    font-weight: 800;
    color: #000000;
    line-height: 1;
    margin: 0;
    letter-spacing: -1px;
}

.stat-suffix {
    font-size: 30px;
    font-weight: 700;
    color: #000000;
    line-height: 1;
}

.card-glow {
    display: none;
}


/* Responsive adjustments */

@media (max-width: 1200px) {
    .stat-number {
        font-size: 40px;
    }
}

@media (max-width: 991px) {
    .stats-header {
        margin-bottom: 50px;
    }
    .card-inner {
        padding: 30px 24px;
    }
}

@media (max-width: 767px) {
    .premium-stats-section .stats-cards-wrapper {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .premium-stats-section .stats-card-col {
        flex: none !important;
        width: auto !important;
        max-width: none !important;
        margin-top: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .stats-title {
        font-size: 32px;
    }
    .stat-number {
        font-size: 36px;
    }
}

.pulse-path {
    fill: none;
    stroke: #e60023;
    stroke-linecap: round;
    stroke-linejoin: round;
    animation: dashPulse 3s linear infinite;
}


/* Core: Solid red center segment - Exact match to connector thickness */

.pulse-core {
    stroke: #e60023;
    stroke-width: 1.2;
    /* Matches connector-path width exactly */
    stroke-dasharray: 15, 255;
    opacity: 1;
    filter: drop-shadow(0 0 1px #e60023);
}


/* Glow: White segment - Also matches connector thickness for a crisp look */

.pulse-glow {
    stroke: #ffffff;
    stroke-width: 1.2;
    /* Matches connector-path width exactly */
    stroke-dasharray: 40, 230;
    opacity: 0.8;
    filter: blur(1.2px);
}

@keyframes dashPulse {
    from {
        stroke-dashoffset: 270;
    }
    to {
        stroke-dashoffset: 0;
    }
}

@media (max-width: 1200px) {
    .features-grid-container {
        flex-direction: column;
        gap: 80px;
        padding: 40px 20px;
    }
    .features-connectors {
        display: none;
    }
    .feature-column {
        width: 100%;
        max-width: 1000px;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        gap: 40px;
    }
    .premium-feature-card {
        width: calc(50% - 20px);
        padding-top: 40px;
    }
}

@media (max-width: 768px) {
    .premium-feature-card {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .premium-feature-card {
        width: 100%;
    }
    .premium-features-title {
        font-size: 32px;
    }
}

.saar-footer__top {
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    color: #ffffff;
    background: #2b2b2b;
}

.saar-footer__top:hover {
    color: #ffffff;
    background: #3a3a3a;
}

@media (max-width: 991px) {
    .saar-footer__inner {
        width: min(100% - 32px, 720px);
        padding-top: 64px;
    }
    .saar-footer__main {
        grid-template-columns: 1fr;
        gap: 44px;
        padding-bottom: 48px;
    }
    .saar-footer__copy {
        max-width: none;
    }
    .saar-footer__media {
        min-height: 360px;
    }
    .saar-footer__image--small {
        height: 250px;
    }
    .saar-footer__image--large {
        height: 320px;
    }
}

@media (max-width: 575px) {
    .saar-footer__inner {
        width: min(100% - 24px, 420px);
        padding: 48px 0 20px;
    }
    .saar-footer__intro {
        font-size: 18px;
    }
    .saar-footer__contact-row {
        grid-template-columns: 1fr;
        gap: 6px;
    }
    .saar-footer__media {
        min-height: 300px;
    }
    .saar-footer__image--small {
        left: 0;
        width: 46%;
        height: 210px;
    }
    .saar-footer__image--large {
        right: 0;
        width: 72%;
        height: 258px;
    }
    .saar-footer__bottom {
        align-items: flex-start;
    }
    .saar-footer__bottom p {
        font-size: 14px;
        line-height: 1.5;
    }
    .saar-footer__top {
        width: 48px;
        height: 48px;
    }
}

.brand-shine-section {
    padding: 40px 0 0;
}

.brand-shine-stage {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    isolation: isolate;
    perspective: 1600px;
}

.brand-shine-laptop-wrap {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.brand-shine-laptop {
    width: min(58vw, 900px);
    transform-style: preserve-3d;
}

.brand-shine-laptop-screen {
    position: relative;
    height: min(32vw, 470px);
    background: linear-gradient(180deg, #262626 0%, #0e0e0e 100%);
    border: 10px solid #5a5a5a;
    border-bottom-width: 12px;
    border-radius: 24px 24px 12px 12px;
    transform-origin: bottom center;
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.35);
    overflow: hidden;
}

.brand-shine-laptop-screen-inner {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 45%, rgba(230, 0, 35, 0.18), transparent 33%), linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(0, 0, 0, 0.1));
}

.brand-shine-laptop-glow {
    position: absolute;
    inset: auto 14% 10% 14%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
}

.brand-shine-laptop-camera {
    position: absolute;
    top: 14px;
    left: 50%;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    border-radius: 50%;
    background: #1a1a1a;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.05);
}

.brand-shine-laptop-base {
    position: relative;
    width: 110%;
    height: 24px;
    margin-left: -5%;
    margin-top: -2px;
    background: linear-gradient(180deg, #bcbcbc 0%, #7c7c7c 100%);
    border-radius: 0 0 28px 28px;
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.28);
}

.brand-shine-laptop-base::before {
    content: "";
    position: absolute;
    top: 0;
    left: 3%;
    right: 3%;
    height: 2px;
    background: rgba(255, 255, 255, 0.3);
}

.brand-shine-laptop-trackpad {
    position: absolute;
    top: 5px;
    left: 50%;
    width: 16%;
    height: 9px;
    margin-left: -8%;
    border-radius: 0 0 10px 10px;
    background: rgba(0, 0, 0, 0.18);
}

.brand-shine-content {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 18px;
    padding: 54px 38px 34px;
    text-align: center;
}

.brand-shine-title {
    margin: 0;
    color: #f5f1eb;
    font-size: clamp(3rem, 6vw, 5.8rem);
    font-weight: 700;
    line-height: 0.86;
    letter-spacing: 0;
    text-transform: uppercase;
}

.brand-shine-title span {
    display: block;
}

.brand-shine-title em {
    color: #e60023;
    font-family: "Times New Roman", serif;
    font-style: italic;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
}

.brand-shine-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #f5f1eb;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(245, 241, 235, 0.7);
    padding-bottom: 6px;
}

.brand-shine-link:hover {
    color: #e60023;
    border-color: #e60023;
}

.brand-shine-link-icon {
    font-size: 16px;
    line-height: 1;
}

.brand-shine-card {
    position: absolute;
    z-index: 3;
    width: min(15vw, 220px);
    will-change: transform;
    transform-style: preserve-3d;
    top: 50%;
    left: 50%;
    transition: filter 0.3s ease;
}

/* Individual Brand Glow Filters */
.brand-shine-card--ps img {
    filter: drop-shadow(0 10px 20px rgba(0, 194, 255, 0.45));
}
.brand-shine-card--web img {
    filter: drop-shadow(0 10px 20px rgba(108, 160, 255, 0.45));
}
.brand-shine-card--fb img {
    filter: drop-shadow(0 10px 20px rgba(24, 119, 242, 0.45));
}
.brand-shine-card--google img {
    filter: drop-shadow(0 10px 20px rgba(52, 168, 83, 0.4));
}
.brand-shine-card--ai img {
    filter: drop-shadow(0 10px 20px rgba(255, 154, 0, 0.45));
}
.brand-shine-card--instagram img {
    filter: drop-shadow(0 10px 20px rgba(225, 48, 108, 0.45));
}
.brand-shine-card--ae img {
    filter: drop-shadow(0 10px 20px rgba(153, 51, 204, 0.45));
}
.brand-shine-card--seo img {
    filter: drop-shadow(0 10px 20px rgba(0, 102, 204, 0.45));
}

.brand-shine-card-inner {
    position: relative;
    overflow: hidden;
    transform-origin: center center;
    will-change: transform;
    border-radius: 12px;
}

/* Floating Animations for Card Inner Containers */
.brand-shine-card--ps .brand-shine-card-inner {
    animation: float-inner-1 5s ease-in-out infinite;
}
.brand-shine-card--web .brand-shine-card-inner {
    animation: float-inner-2 6s ease-in-out infinite;
}
.brand-shine-card--fb .brand-shine-card-inner {
    animation: float-inner-3 4.5s ease-in-out infinite;
}
.brand-shine-card--google .brand-shine-card-inner {
    animation: float-inner-4 5.5s ease-in-out infinite;
}
.brand-shine-card--ai .brand-shine-card-inner {
    animation: float-inner-2 5.2s ease-in-out infinite 0.4s;
}
.brand-shine-card--instagram .brand-shine-card-inner {
    animation: float-inner-1 5.8s ease-in-out infinite 0.2s;
}
.brand-shine-card--ae .brand-shine-card-inner {
    animation: float-inner-4 4.8s ease-in-out infinite 0.6s;
}
.brand-shine-card--seo .brand-shine-card-inner {
    animation: float-inner-3 6.2s ease-in-out infinite 0.8s;
}

@keyframes float-inner-1 {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-7px) rotate(1.2deg); }
}
@keyframes float-inner-2 {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-10px) rotate(-0.8deg); }
}
@keyframes float-inner-3 {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-6px) rotate(0.9deg); }
}
@keyframes float-inner-4 {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-8px) rotate(-1.3deg); }
}

.brand-shine-card-inner img {
    display: block;
    width: 100%;
    aspect-ratio: 0.75;
    object-fit: cover;
    backface-visibility: visible;
}

.brand-shine-card--logo .brand-shine-card-inner {
    background: transparent;
    box-shadow: none;
}

.brand-shine-card--logo .brand-shine-card-inner img {
    object-fit: contain;
    aspect-ratio: 1;
}

@media (max-width: 1199px) {
    .brand-shine-section {
        overflow: hidden;
    }
    .brand-shine-stage {
        min-height: 100vh;
        padding: 72px 24px;
        display: block;
    }
    .brand-shine-content {
        position: absolute;
        inset: 0;
        gap: 16px;
        padding: 44px 28px 28px;
    }
    .brand-shine-card {
        position: absolute;
        inset: auto;
        width: min(20vw, 180px);
        top: 50%;
        left: 50%;
    }
    .brand-shine-card-inner {
        max-width: 100%;
    }
}

@media (max-width: 575px) {
    .brand-shine-stage {
        min-height: 56vh;
        padding: 42px 10px 24px;
    }
    .brand-shine-title {
        font-size: clamp(1.75rem, 10vw, 2.7rem);
    }
    .brand-shine-link {
        gap: 8px;
        font-size: 12px;
        letter-spacing: 0.06em;
    }
    .brand-shine-card-inner img {
        aspect-ratio: 0.82;
    }
}

.main-header .logo img,
.sticky-header .logo img,
.mobile-menu .nav-logo img {
    width: 150px;
    height: auto;
    max-height: 64px;
    object-fit: contain;
}

.main-header .logo,
.sticky-header .logo {
    display: flex;
    align-items: center;
}

@media (max-width: 767px) {
    .main-header .logo img,
    .sticky-header .logo img,
    .mobile-menu .nav-logo img {
        width: 128px;
        max-height: 54px;
    }
}

@media (min-width: 1200px) {
    .main-header .logo {
        margin-left: 85px;
    }
}

.main-menu {
    margin: auto;
}

.sticky-header.fixed-header.animated.slideInDown .main-header .logo,
.sticky-header .logo {
    margin-left: 0px;
}


/* @media screen and (min-width:768px) {
    .brand-shine-section {
        margin-top: -100px;
    }
} */

.content-box h4.title {
    color: #fff;
}

section.work-process-section.section-padding .content-box h4.title {
    color: #1e1e1e;
}


/* Index — Working Process steps horizontal (6 services) */

.work-process-section--horizontal .work-process-steps-row {
    margin-top: clamp(2rem, 4vw, 3rem);
}

.work-process-section--horizontal .work-process-content-1 .work-process-thumb {
    margin-top: clamp(2.5rem, 5vw, 4.5rem);
}

.work-process-section--horizontal .working-block-one {
    height: 100%;
}

.work-process-section--horizontal .working-block-one .inner-block {
    flex-direction: column;
    align-items: flex-start;
    margin-top: 0;
    gap: 1rem;
    height: 100%;
}

.work-process-section--horizontal .working-block-one .inner-block.top-margin-none {
    margin-top: 0;
}

.work-process-section--horizontal .working-block-one .inner-block .step {
    writing-mode: horizontal-tb;
    width: auto;
    min-width: 0;
    height: auto;
    padding: 0.45rem 0.9rem;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    border-radius: 999px;
    transform: none;
}

.work-process-section--horizontal .working-block-one .inner-block .content-box {
    padding-bottom: 1.25rem;
    width: 100%;
}

.work-process-section--horizontal .working-block-one .inner-block .content-box .title {
    font-size: clamp(0.9rem, 1vw, 1.05rem);
    line-height: 1.3;
}

.work-process-section--horizontal .working-block-one .inner-block .content-box .text {
    max-width: none;
    font-size: 0.82rem;
    line-height: 1.55;
    margin-top: 0.45rem;
}

.work-process-section--horizontal .working-block-one .inner-block .content-box .line {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}

@media (min-width: 992px) {
    .work-process-section--horizontal .work-process-steps-row {
        position: relative;
    }
    .work-process-section--horizontal .working-block-one {
        position: relative;
        z-index: 1;
    }
}

@media (max-width: 991.98px) {
    .work-process-section--horizontal .work-process-content-1 .work-process-thumb {
        display: block;
        margin-top: 2rem;
    }
    .work-process-section--horizontal .working-block-one .inner-block .content-box .title {
        font-size: 1rem;
    }
    .work-process-section--horizontal .working-block-one .inner-block .content-box .text {
        font-size: 0.9rem;
    }
}

.video-image.fix .content h3 {
    color: #fff;
    text-shadow: 0 0 10px #0008;
}


/* Ultra Premium About Section */

.minimal-about-section {
    position: relative;
    overflow: hidden;
    padding: 30px 0;
    z-index: 1;
}

.minimal-about-section::before,
.minimal-about-section::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    z-index: -1;
    opacity: 0.7;
    pointer-events: none;
}

.minimal-about-section::before {
    width: 500px;
    height: 500px;
    background: rgba(230, 0, 35, 0.06);
    top: -150px;
    left: -150px;
}

.minimal-about-section::after {
    width: 600px;
    height: 600px;
    background: rgba(0, 0, 0, 0.02);
    bottom: -200px;
    right: -150px;
}

.minimal-about-image-wrapper {
    position: relative;
    border-radius: 35px;
    z-index: 1;
    padding: 15px;
}

.minimal-about-image-wrapper::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 35px;
    background: linear-gradient(135deg, rgba(230, 0, 35, 0.15) 0%, rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.05) 100%);
    z-index: -1;
    transition: all 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

.minimal-about-image-wrapper:hover::before {
    transform: scale(1.03);
    background: linear-gradient(135deg, rgba(230, 0, 35, 0.25) 0%, rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.1) 100%);
}

.image-reveal-mask {
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.08);
}

.minimal-main-image {
    width: 100%;
    transform: scale(1.02);
    transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
    object-fit: cover;
    display: block;
}

.minimal-about-image-wrapper:hover .minimal-main-image {
    transform: scale(1.05);
}

.glassmorphism {
    position: absolute;
    bottom: -30px;
    right: -30px;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    padding: 30px 40px;
    border-radius: 24px;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.6);
    display: flex;
    align-items: center;
    gap: 24px;
    z-index: 2;
    border: 1px solid rgba(255, 255, 255, 0.8);
}

.experience-number {
    font-family: var(--heading-font-family, sans-serif);
    font-size: 56px;
    font-weight: 800;
    color: #1a1a1a;
    line-height: 1;
    display: flex;
    align-items: flex-start;
}

.experience-number .plus {
    color: #e60023;
    font-size: 40px;
    margin-top: -5px;
}

.experience-text {
    font-size: 15px;
    color: #555;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    line-height: 1.4;
}

.minimal-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 18px;
    background: #fff5f6;
    color: #e60023;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    border-radius: 40px;
    margin-bottom: 24px;
}

.badge-dot {
    width: 6px;
    height: 6px;
    background-color: #e60023;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(230, 0, 35, 0.15);
}

.minimal-heading {
    font-family: var(--heading-font-family, sans-serif);
    font-size: clamp(36px, 4.5vw, 54px);
    font-weight: 800;
    color: #0f0f0f;
    line-height: 1.15;
    margin-bottom: 30px;
    letter-spacing: -0.03em;
}

.heading-highlight {
    background: linear-gradient(135deg, #e60023 0%, #ff4b4b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.minimal-description {
    font-size: 18px;
    color: #555;
    line-height: 1.8;
    margin-bottom: 40px;
    max-width: 90%;
}

.minimal-features-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 30px;
}

.feature-item {
    display: flex;
    align-items: center;
    gap: 16px;
    background: #ffffff;
    padding: 16px 20px;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    border: 1px solid rgba(0, 0, 0, 0.03);
    transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
    cursor: default;
}

.feature-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(230, 0, 35, 0.08);
    border-color: rgba(230, 0, 35, 0.1);
}

.feature-item .icon-wrap {
    width: 32px;
    height: 32px;
    background: linear-gradient(135deg, #fff5f6 0%, #ffe0e4 100%);
    color: #e60023;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: all 0.3s ease;
}

.feature-item:hover .icon-wrap {
    background: #e60023;
    color: #ffffff;
    box-shadow: 0 5px 15px rgba(230, 0, 35, 0.3);
}

.feature-item span {
    font-size: 16px;
    color: #222;
    font-weight: 700;
}

.premium-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 18px 45px;
    background: #111;
    color: #fff !important;
    font-size: 16px;
    font-weight: 700;
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
    position: relative;
    overflow: hidden;
}

.premium-btn .btn-icon {
    margin-left: 12px;
    transition: transform 0.3s ease;
}

.premium-btn:hover {
    background: #e60023;
    transform: translateY(-3px);
    box-shadow: 0 15px 30px rgba(230, 0, 35, 0.25);
}

.premium-btn:hover .btn-icon {
    transform: translateX(5px);
}

@media (max-width: 1199px) {
    .glassmorphism {
        right: -10px;
        bottom: -20px;
        padding: 25px 35px;
    }
}

@media (max-width: 991px) {
    .minimal-about-content {
        /* margin-top: 60px; */
    }
    .glassmorphism {
        right: 10px;
    }
    .minimal-description {
        max-width: 100%;
    }
}

@media (max-width: 575px) {
    .minimal-features-grid {
        grid-template-columns: 1fr;
    }
    .experience-number {
        font-size: 42px;
    }
    .glassmorphism {
        padding: 20px 25px;
        bottom: -30px;
    }
}


/* Animations for Minimal About */

@keyframes floatSoft {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-12px);
    }
    100% {
        transform: translateY(0px);
    }
}

@keyframes pulseGlow {
    0% {
        box-shadow: 0 0 0 0 rgba(230, 0, 35, 0.2);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(230, 0, 35, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(230, 0, 35, 0);
    }
}

.glassmorphism {
    animation: floatSoft 6s ease-in-out infinite;
}

.badge-dot {
    animation: pulseGlow 2s infinite;
}

.image-reveal-mask {
    transition: all 0.5s ease;
}

.minimal-about-image-wrapper:hover .image-reveal-mask {
    box-shadow: 0 40px 80px rgba(0, 0, 0, 0.12);
}


/* About 2 Section */

.about-2-section {
    background-color: #ffffff;
    overflow: hidden;
}

.about-2-content .minimal-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #ffffff;
    border: 1px solid #eeeeee;
    padding: 8px 20px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 600;
    color: #1a1a1a;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
    margin-bottom: 25px;
}

.about-2-content .badge-dot {
    width: 8px;
    height: 8px;
    background: #ff5e14;
    border-radius: 50%;
    display: inline-block;
}

.about-2-title {
    font-size: clamp(32px, 4vw, 48px);
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.2;
    margin-bottom: 25px;
    letter-spacing: -1px;
}

.about-2-text {
    font-size: 16px;
    color: #666;
    line-height: 1.7;
    margin-bottom: 40px;
}

.btn-about-story {
    display: inline-flex;
    align-items: center;
    background: linear-gradient(90deg, #ff5e14, #ff8a00);
    color: #fff;
    padding: 12px 20px 12px 30px;
    border-radius: 40px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-about-story:hover {
    color: #fff;
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(255, 94, 20, 0.2);
}

.btn-about-story .btn-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    background: #fff;
    color: #ff5e14;
    border-radius: 50%;
    margin-left: 15px;
    transition: transform 0.3s ease;
}

.btn-about-story:hover .btn-icon {
    transform: translateX(3px);
}

.about-2-grid-wrapper {
    position: relative;
    padding: 20px;
    max-width: 100%;
    margin: 0 auto;
}

.about-2-card {
    background: #f8f9fa;
    border-radius: 16px;
    padding: 40px 30px;
    height: 100%;
    transition: transform 0.3s ease, background 0.3s ease;
}

.about-2-card:hover {
    background: #f1f3f5;
    transform: translateY(-5px);
}

@media (min-width: 992px) {
    .about-2-section .about-2-card {
        height: 250px !important;
        min-height: 0 !important;
    }

    .about-2-section .about-2-card img {
        width: 100%;
        height: 100% !important;
        object-fit: cover;
    }
}

.about-2-card .card-icon {
    font-size: 24px;
    color: #1a1a1a;
    margin-bottom: 20px;
}

.about-2-card .card-num {
    font-size: 42px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 5px;
    line-height: 1;
}

.about-2-card .card-text {
    font-size: 15px;
    color: #666;
    margin: 0;
}


/* Center Animating Icon */

.center-anim-icon-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100px;
    height: 100px;
    background: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08);
}

.center-anim-icon-wrapper::before {
    content: '';
    position: absolute;
    inset: -15px;
    border: 1px dashed #dd333859;
    border-radius: 50%;
    animation: rotateDash 10s linear infinite;
}

@keyframes rotateDash {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.center-anim-icon {
    width: 70px;
    height: 70px;
    background: #fffaf5;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.center-anim-icon img {
    width: 60px;
    height: auto;
    display: block;
}

html {
    scroll-behavior: smooth;
}


/* Modern CTA Section */

.modern-cta-section {
    padding: 50px 0;
    position: relative;
    z-index: 1;
}

.modern-cta-wrapper {
    background: #0a0a0a;
    border-radius: 20px;
    position: relative;
    padding: 60px 50px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.15);
    display: flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.cta-left-accent {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 12px;
    background: linear-gradient(180deg, #e60023, #ff4b4b);
    border-radius: 20px 0 0 20px;
    box-shadow: 5px 0 20px rgba(230, 0, 35, 0.4);
}

.cta-content {
    width: 100%;
    position: relative;
    z-index: 2;
}

.cta-title {
    color: #ffffff;
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
    letter-spacing: -0.5px;
}

.cta-call-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #e60023;
    color: #ffffff;
    padding: 16px 40px;
    border-radius: 50px;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.4s ease;
    box-shadow: 0 10px 30px rgba(230, 0, 35, 0.3);
    text-decoration: none;
    border: 2px solid transparent;
}

.cta-call-btn:hover {
    background: transparent;
    color: #e60023;
    border-color: #e60023;
    transform: translateY(-3px);
    box-shadow: 0 15px 40px rgba(230, 0, 35, 0.4);
}

.cta-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    z-index: 0;
    pointer-events: none;
}

.cta-glow.glow-1 {
    width: 300px;
    height: 300px;
    background: rgba(230, 0, 35, 0.15);
    top: -150px;
    right: -100px;
}

.cta-glow.glow-2 {
    width: 200px;
    height: 200px;
    background: rgba(255, 255, 255, 0.05);
    bottom: -100px;
    left: 10%;
}

@media (max-width: 991px) {
    .modern-cta-wrapper {
        padding: 40px 30px;
    }
    .cta-left-accent {
        width: 8px;
    }
}


/* Floating Hover Image for Premium Feature Cards */

.floating-hover-image {
    position: absolute;
    width: 220px;
    height: 280px;
    border-radius: 12px;
    overflow: hidden;
    pointer-events: none;
    opacity: 0;
    z-index: 100;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.8) rotate(-10deg);
    border: 3px solid #fff;
}

.floating-hover-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.process-section {
    padding: 96px 20px;
    /* background: linear-gradient(180deg, #ffffff 0%, #fafafa 46%, #ffffff 100%); */
    color: #111;
    overflow: visible;
}

.process-inner {
    max-width: 1200px;
    margin: 0 auto;
}

.process-head {
    text-align: center;
    max-width: 820px;
    margin: 0 auto 78px;
}

.process-head h2 {
    margin: 0 0 18px;
    font-size: clamp(2rem, 3vw, 3.2rem);
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.process-head p {
    margin: 0;
    font-size: 1rem;
    line-height: 1.8;
    color: #666;
}

.process-curve {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 86px;
    padding: 14px 0 10px;
    isolation: isolate;
}

.process-curve::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 2px;
    bottom: 2px;
    width: 1px;
    transform: translateX(-50%);
    background: linear-gradient(to bottom, transparent 0%, rgba(17, 17, 17, .08) 16%, rgba(230, 0, 35, .16) 50%, rgba(17, 17, 17, .08) 84%, transparent 100%);
    border-radius: 999px;
    opacity: .95;
    z-index: 0;
}

.process-curve-path {
    position: absolute;
    inset: -28px 0 -18px;
    z-index: 0;
    width: 100%;
    height: calc(100% + 46px);
    pointer-events: none;
}

.process-path-shadow,
.process-path-main {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.process-path-shadow {
    stroke: rgba(230, 0, 35, .08);
    stroke-width: 18;
    filter: blur(5px);
}

.process-path-main {
    stroke: url(#processClassicGradient);
    stroke-width: 2;
    stroke-dasharray: 12 14;
}

.process-item {
    position: relative;
    z-index: 1;
    min-height: 112px;
    padding: 24px 26px 22px;
    border: 1px solid rgba(17, 17, 17, .08);
    border-radius: 22px;
    background: linear-gradient(145deg, #ffffff 0%, #fbfbfb 100%);
    box-shadow: 0 16px 38px rgba(0, 0, 0, .05);
    overflow: visible;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.process-item:nth-of-type(odd) {
    margin-right: 22px;
    border-radius: 42px 18px 18px 42px;
    text-align: right;
}

.process-item:nth-of-type(even) {
    margin-left: 22px;
    border-radius: 18px 42px 42px 18px;
}

.process-item::before {
    content: "";
    position: absolute;
    top: 50%;
    width: 68px;
    height: 2px;
    background: linear-gradient(90deg, rgba(230, 0, 35, .32), rgba(17, 17, 17, .06));
    transform: translateY(-50%);
}

.process-item:nth-of-type(odd)::before {
    right: -68px;
}

.process-item:nth-of-type(even)::before {
    left: -68px;
    background: linear-gradient(90deg, rgba(17, 17, 17, .06), rgba(230, 0, 35, .32));
}

.process-dot {
    position: absolute;
    top: 50%;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #e60023;
    box-shadow: 0 0 0 8px rgba(230, 0, 35, .07), 0 0 0 1px rgba(255, 255, 255, .9);
    transform: translateY(-50%);
}

.process-item:nth-of-type(odd) .process-dot {
    right: -8px;
}

.process-item:nth-of-type(even) .process-dot {
    left: -8px;
}

.process-step {
    display: block;
    margin-bottom: 8px;
    font-size: .82rem;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #8a8a8a;
}

.process-item h3 {
    margin: 0;
    font-size: 1.18rem;
    line-height: 1.25;
    font-weight: 700;
}

.process-item:hover {
    transform: translateY(-4px);
    border-color: rgba(230, 0, 35, .18);
    box-shadow: 0 22px 46px rgba(0, 0, 0, .08);
}

@media (max-width: 900px) {
    .process-curve {
        grid-template-columns: 1fr;
        gap: 22px;
        padding-left: 36px;
    }
    .process-curve::before {
        left: 18px;
        transform: none;
    }
    .process-curve-path {
        display: none;
    }
    .process-item {
        margin: 0 !important;
        padding: 20px 20px 20px 50px;
        border-radius: 18px 34px 34px 18px !important;
        text-align: left !important;
    }
    .process-item::before {
        left: -34px !important;
        right: auto !important;
        width: 34px;
        background: linear-gradient(90deg, rgba(17, 17, 17, .06), rgba(230, 0, 35, .32));
    }
    .process-dot {
        left: -8px !important;
        right: auto !important;
    }
}

@media (max-width: 640px) {
    .process-section {
        padding: 64px 16px;
    }
    .process-head {
        margin-bottom: 40px;
    }
    .process-curve {
        gap: 18px;
    }
    .process-item {
        padding: 18px 16px 18px 50px;
    }
}

.process-section {
    padding: 90px 0;
    overflow: hidden;
}

.process-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
}

.process-head {
    text-align: center;
    max-width: 820px;
    margin: 0 auto 50px;
}

.process-head h2 {
    margin: 0 0 16px;
    font-size: clamp(2rem, 3vw, 3.2rem);
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: #111;
}

.process-head p {
    margin: 0;
    font-size: 1rem;
    line-height: 1.8;
    color: #666;
}

.process-wrap {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.process-track {
    display: flex;
    gap: 28px;
    width: max-content;
    padding: 30px 0 60px;
    will-change: transform;
}

.process-item {
    position: relative;
    min-width: 260px;
    max-width: 260px;
    padding: 24px 22px 22px 58px;
    border: 1px solid #ececec;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .04);
}

.process-item:nth-child(odd) {
    transform: translateY(-28px);
}

.process-item:nth-child(even) {
    transform: translateY(28px);
}

.process-item::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 320px;
    height: 2px;
    background: linear-gradient(90deg, rgba(230, 0, 35, .18), rgba(17, 17, 17, .08), rgba(230, 0, 35, .18));
    transform: translateY(-50%);
    z-index: -1;
}

.process-dot {
    position: absolute;
    left: 18px;
    top: 24px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #e60023;
    box-shadow: 0 0 0 6px rgba(230, 0, 35, .06);
}

.process-step {
    display: block;
    margin-bottom: 8px;
    font-size: .82rem;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #8a8a8a;
}

.process-item h3 {
    margin: 0;
    font-size: 1.18rem;
    line-height: 1.25;
    font-weight: 700;
    color: #111;
}

@media (max-width: 768px) {
    .process-track {
        gap: 18px;
        padding-bottom: 20px;
    }
    .process-item {
        min-width: 220px;
        max-width: 220px;
    }
    .process-item:nth-child(odd),
    .process-item:nth-child(even) {
        transform: none;
    }
    .process-item::before {
        width: 220px;
    }
}

.process-section.process-horizontal {
    position: relative;
    padding: 80px 0 120px;
    overflow: hidden;
}

.process-section.process-horizontal .process-ambient {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.process-section.process-horizontal .process-inner {
    position: relative;
    z-index: 1;
}

.process-section.process-horizontal .process-head {
    opacity: 1;
    transform: none;
}

.process-section.process-horizontal .process-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 7px 16px;
    border-radius: 999px;
    background: rgba(230, 0, 35, .08);
    border: 1px solid rgba(230, 0, 35, .16);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #e60023;
}

.process-section.process-horizontal .process-eyebrow::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #e60023;
    box-shadow: 0 0 0 6px rgba(230, 0, 35, .18);
    animation: processPulse 2s ease-in-out infinite;
}

.process-section.process-horizontal .process-anchor {
    opacity: 1;
    transform: none;
}

.process-section.process-horizontal .process-path-main,
.process-section.process-horizontal .process-path-shadow {
    opacity: 1;
}

.process-section.process-horizontal .process-path-progress {
    opacity: 0;
}

.process-section.process-horizontal.is-path-drawn .process-path-main {
    stroke: url(#processClassicGradient);
    stroke-dasharray: 10 12;
    animation: none;
}

.process-section.process-horizontal.is-pinning .process-path-main,
.process-section.process-horizontal.is-ready.is-pinning .process-path-main {
    animation: none;
}

.process-section.process-horizontal .process-scroll-stage {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 460px;
    padding: 20px 0 40px;
    box-sizing: border-box;
}

.process-section.process-horizontal .process-scroll-stage.is-pinning {
    min-height: 460px;
}

.process-section.process-horizontal .process-inner {
    max-width: 1320px;
    padding: 0 24px;
}

.process-section.process-horizontal .process-head {
    margin-bottom: 48px;
    text-align: center;
}

.process-section.process-horizontal .process-head h2 {
    margin: 0 0 16px;
    font-size: clamp(1.85rem, 3.2vw, 3rem);
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -.03em;
    color: #0f0f0f;
}

.process-section.process-horizontal .process-head p {
    margin: 0 auto;
    max-width: 640px;
    font-size: 1.02rem;
    line-height: 1.75;
    color: #666;
}

.process-section.process-horizontal .process-curve {
    position: relative;
    display: block;
    width: 100%;
    max-width: 1180px;
    min-height: 400px;
    margin: 0 auto;
    padding: 110px 0 110px;
    isolation: isolate;
    contain: layout style;
}

.process-section.process-horizontal .process-curve::before {
    display: none;
}

.process-section.process-horizontal .process-curve-path {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    width: 100%;
    height: auto;
    max-height: 300px;
    transform: translateY(-50%);
    z-index: 0;
    pointer-events: none;
}

.process-section.process-horizontal .process-path-shadow,
.process-section.process-horizontal .process-path-main {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.process-section.process-horizontal .process-path-shadow {
    stroke: rgba(230, 0, 35, .2);
    stroke-width: 14;
    opacity: .32;
}

.process-section.process-horizontal .process-path-main {
    stroke-width: 3.5;
    stroke: #e60023;
}

.process-section.process-horizontal .process-path-progress {
    fill: none;
    stroke: #fff;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: 0;
    pointer-events: none;
}

.process-section.process-horizontal.is-pinning .process-path-shadow,
.process-section.process-horizontal.is-pinning .process-path-main,
.process-section.process-horizontal.is-pinning .process-path-progress {
    will-change: auto;
}

.process-section.process-horizontal .process-anchor {
    position: absolute;
    z-index: 2;
    width: 0;
    height: 0;
    transform-origin: center center;
}

.process-section.process-horizontal .process-dot {
    display: none;
}

.process-section.process-horizontal .process-connector {
    position: absolute;
    left: 0;
    width: 2px;
    height: var(--process-connector-h, 36px);
    transform: translateX(-50%);
    z-index: 1;
    border-radius: 999px;
    pointer-events: none;
    opacity: .85;
    transition: opacity .35s ease, height .35s ease;
}

.process-section.process-horizontal .process-anchor.is-path-below .process-connector {
    top: var(--process-dot-r, 8px);
    background: linear-gradient(180deg, #e60023 0%, rgba(230, 0, 35, .12) 100%);
    box-shadow: 0 0 12px rgba(230, 0, 35, .2);
}

.process-section.process-horizontal .process-anchor.is-path-above .process-connector {
    top: calc(-1 * var(--process-dot-r, 8px));
    bottom: auto;
    transform: translate(-50%, -100%);
    background: linear-gradient(0deg, #e60023 0%, rgba(230, 0, 35, .12) 100%);
    box-shadow: 0 0 12px rgba(230, 0, 35, .2);
}

.process-section.process-horizontal .process-item {
    position: absolute;
    left: 50%;
    --process-card-width: 210px;
    width: 210px;
    min-width: 0;
    max-width: none;
    min-height: 100px;
    margin: 0 !important;
    padding: 20px 20px 18px 54px;
    border: 1px solid rgba(17, 17, 17, .06);
    border-radius: 20px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .98) 0%, rgba(250, 250, 252, .92) 100%);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .055);
    text-align: left !important;
    transform: translateX(-50%);
    transition: border-color .35s ease, box-shadow .35s ease, transform .35s cubic-bezier(.22, 1, .36, 1);
    overflow: hidden;
}

.process-section.process-horizontal .process-item::before {
    display: block !important;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, #e60023, #ff4d6d);
    opacity: .35;
    transition: opacity .35s ease;
}

.process-section.process-horizontal .process-item::after {
    display: none !important;
}

.process-section.process-horizontal .process-step-badge {
    position: absolute;
    left: 16px;
    top: 18px;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: linear-gradient(135deg, #e60023, #ff3d5a);
    color: #fff;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1;
    box-shadow: 0 6px 14px rgba(230, 0, 35, .2);
}

.process-section.process-horizontal .process-anchor.is-path-below .process-item {
    top: calc(var(--process-dot-r, 8px) + var(--process-connector-h, 36px) + 12px);
}

.process-section.process-horizontal .process-anchor.is-path-above .process-item {
    bottom: calc(var(--process-dot-r, 8px) + var(--process-connector-h, 36px) + 12px);
    top: auto;
}

.process-section.process-horizontal .process-anchor.is-active .process-item {
    border-color: rgba(230, 0, 35, .28);
    box-shadow: 0 10px 26px rgba(230, 0, 35, .1);
    transform: translateX(-50%) translateY(-4px);
}

.process-section.process-horizontal .process-anchor.is-active .process-item::before {
    opacity: 1;
}

.process-section.process-horizontal .process-anchor.is-active .process-connector {
    opacity: 1;
    box-shadow: 0 0 16px rgba(230, 0, 35, .35);
}

.process-section.process-horizontal .process-path-node.is-active {
    fill: #e60023;
    stroke: #fff;
    stroke-width: 3px;
}

.process-section.process-horizontal .process-anchor:hover .process-item {
    border-color: rgba(230, 0, 35, .2);
    box-shadow: 0 14px 30px rgba(0, 0, 0, .075);
    transform: translateX(-50%) translateY(-3px);
}

.process-section.process-horizontal .process-path-node {
    fill: #fff;
    stroke: #e60023;
    stroke-width: 2.5px;
    pointer-events: none;
    transition: fill .25s ease, stroke .25s ease;
}

.process-section.process-horizontal .process-step {
    display: block;
    margin-bottom: 6px;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #e60023;
    opacity: .85;
}

.process-section.process-horizontal .process-item h3 {
    margin: 0;
    font-size: 1.12rem;
    line-height: 1.25;
    font-weight: 700;
    color: #111;
    letter-spacing: -.02em;
}

.process-section.process-horizontal .process-item h3::before,
.process-section.process-horizontal .process-item h3::after {
    display: none !important;
}

.process-scroll-man {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 5;
    width: 90px;
    height: 120px;
    opacity: 1;
    pointer-events: none;
    transform-origin: 50% 92%;
    transform: translate3d(0, 0, 0) translate(-50%, -92%);
    will-change: transform;
}

.process-man-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none;
    user-select: none;
}

.process-section.process-horizontal .process-scroll-man::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 2px;
    width: 48px;
    height: 12px;
    border-radius: 50%;
    background: rgba(230, 0, 35, .18);
    transform: translateX(-50%);
    animation: none;
}

.process-section.process-horizontal.is-pinning .process-scroll-man::after {
    animation: none;
    opacity: .4;
}

.process-section.process-horizontal.is-pinning .process-glow {
    opacity: .35;
}

@media (prefers-reduced-motion: reduce) {
    .process-section.process-horizontal .process-path-main,
    .process-section.process-horizontal .process-eyebrow::before,
    .process-section.process-horizontal .process-scroll-man::after {
        animation: none !important;
    }
}

@keyframes processDashMove {
    to {
        stroke-dashoffset: -290;
    }
}

@keyframes processPulse {
    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.15);
        opacity: .7;
    }
}

@keyframes processManShadow {
    0%,
    100% {
        transform: translateX(-50%) scale(1);
        opacity: .55;
    }
    50% {
        transform: translateX(-50%) scale(1.15);
        opacity: .35;
    }
}

@keyframes processNodePulse {
    0%,
    100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.12);
    }
}

@media (max-width: 1100px) {
    .process-section.process-horizontal .process-item {
        --process-card-width: 160px;
        width: 160px;
        padding: 19px 16px 18px;
    }
    .process-section.process-horizontal .process-item h3 {
        font-size: 1rem;
    }
}

@media (max-width: 900px) {
    .process-section.process-horizontal .process-head,
    .process-section.process-horizontal .process-anchor {
        opacity: 1;
        transform: none;
    }
    .process-section.process-horizontal .process-path-main,
    .process-section.process-horizontal .process-path-shadow {
        opacity: 1;
    }
    .process-section.process-horizontal .process-scroll-stage {
        min-height: auto;
    }
    .process-section.process-horizontal .process-curve {
        display: grid;
        grid-template-columns: 1fr;
        gap: 18px;
        min-height: auto;
        padding-left: 36px;
    }
    .process-section.process-horizontal .process-curve::before {
        display: block;
        left: 18px;
        top: 10px;
        bottom: 10px;
        width: 2px;
        transform: none;
        background: linear-gradient(180deg, transparent, rgba(230, 0, 35, .28), transparent);
    }
    .process-section.process-horizontal .process-curve-path,
    .process-section.process-horizontal .process-scroll-man {
        display: none;
    }
    .process-section.process-horizontal .process-anchor {
        position: relative;
        left: auto !important;
        top: auto !important;
        width: 100%;
        height: auto;
    }
    .process-section.process-horizontal .process-connector,
    .process-section.process-horizontal .process-path-nodes {
        display: none;
    }
    .process-section.process-horizontal .process-dot {
        left: -26px;
        top: 32px;
        transform: none;
    }
    .process-section.process-horizontal .process-item {
        position: relative;
        left: auto;
        top: auto;
        bottom: auto;
        width: 100%;
        min-height: 96px;
        padding: 20px 20px 20px 54px;
        border-radius: 18px !important;
        transform: none;
    }
    .process-section.process-horizontal .process-step-badge {
        display: inline-flex;
    }
    .process-section.process-horizontal .process-ambient {
        display: none;
    }
}


/* Why Us — Markiv-style (https://markiv.webflow.io/home/home-one) */

.saar-why-section {
    position: relative;
    overflow: hidden;
}

.saar-why-section::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.saar-why-section .container {
    position: relative;
    z-index: 1;
    max-width: 1240px;
}

.saar-why-head {
    margin-bottom: 56px;
}

.saar-why-head .sub-title {
    color: #666;
}

.saar-why-head .title {
    margin: 0;
    color: #111;
    font-size: clamp(2rem, 4vw, 3.25rem);
    font-weight: 600;
    letter-spacing: -.03em;
}


/* ══════════════════════════════════════
   SERVICES GRID — Modern responsive services layout
   ══════════════════════════════════════ */

.modern-services-section {
    position: relative;
    padding: 80px 0 100px;
    background-color: var(--body-bg);
    overflow: hidden;
}

/* ── Decorative background shapes ── */
.services-shapes {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.services-shapes .shape {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.04;
}

.services-shapes .shape-1 {
    top: -10%;
    left: -10%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, var(--theme-color1), transparent 70%);
}

.services-shapes .shape-2 {
    bottom: -10%;
    right: -10%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, var(--theme-color1), transparent 70%);
}

.services-grid-wrapper {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

/* ── Service card ── */
.service-grid-card {
    position: relative;
    background: var(--theme-color-white);
    border: 1px solid rgba(0, 0, 0, 0.05);
    border-radius: 20px;
    padding: 40px 35px 35px;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.4s cubic-bezier(0.25, 1, 0.5, 1), border-color 0.4s ease;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.service-grid-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, var(--theme-color1), #ff4d6d);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.4s ease;
}

.service-grid-card:hover {
    transform: translateY(-8px);
    border-color: rgba(230, 0, 35, 0.15);
    box-shadow: 0 20px 40px rgba(230, 0, 35, 0.06), 0 1px 3px rgba(0, 0, 0, 0.02);
}

.service-grid-card:hover::before {
    transform: scaleX(1);
}

/* Card number badge */
.card-number {
    position: absolute;
    top: 30px;
    right: 35px;
    font-size: 2.2rem;
    font-weight: 800;
    font-family: monospace;
    color: rgba(0, 0, 0, 0.05);
    line-height: 1;
    transition: color 0.4s ease;
    user-select: none;
}

.service-grid-card:hover .card-number {
    color: rgba(230, 0, 35, 0.09);
}

/* Service icon container */
.service-icon-box {
    width: 68px;
    height: 68px;
    border-radius: 16px;
    background-color: rgba(230, 0, 35, 0.05);
    color: var(--theme-color1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
    transition: background-color 0.4s ease, color 0.4s ease, transform 0.4s ease;
}

.service-icon-box svg {
    width: 32px;
    height: 32px;
    stroke: currentColor;
    transition: stroke-width 0.3s ease;
}

.service-grid-card:hover .service-icon-box {
    background-color: var(--theme-color1);
    color: var(--theme-color-white);
    transform: scale(1.05);
}

/* Titles & descriptions */
.service-title {
    font-size: 1.35rem;
    font-weight: 600;
    color: var(--headings-color);
    margin-bottom: 15px;
    line-height: 1.3;
    transition: color 0.3s ease;
}

.service-grid-card:hover .service-title {
    color: var(--theme-color1);
}

.service-desc {
    font-size: 0.92rem;
    line-height: 1.65;
    color: var(--text-color);
    margin-bottom: 30px;
    flex-grow: 1;
}

/* Service CTA link */
.service-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--headings-color);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: color 0.3s ease;
    margin-top: auto;
    width: fit-content;
}

.service-link .arrow-icon {
    width: 18px;
    height: 18px;
    transition: transform 0.3s ease;
}

.service-grid-card:hover .service-link {
    color: var(--theme-color1);
}

.service-grid-card:hover .service-link .arrow-icon {
    transform: translateX(6px);
}

/* ── Responsive breakpoints ── */
@media (max-width: 991px) {
    .services-grid-wrapper {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }
    .service-grid-card {
        padding: 35px 30px 30px;
    }
}

@media (max-width: 575px) {
    .modern-services-section {
        padding: 60px 0 80px;
    }
    .services-grid-wrapper {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .service-grid-card {
        padding: 30px 25px 25px;
    }
    .card-number {
        top: 25px;
        right: 25px;
        font-size: 1.8rem;
    }
    .service-icon-box {
        margin-bottom: 25px;
    }
}


/* Contact form + heading — drop-in on load (bottom → top) */

.contact-form-block .contact-form-drop {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-56px);
    will-change: transform, opacity;
}


/* Contact page info icons */

.contact-details__right {
    position: relative;
    margin-left: clamp(0px, 4vw, 54px);
    padding: 34px 34px 36px;
    border: 1px solid rgba(17, 17, 17, 0.08);
    border-radius: 8px;
    overflow: hidden;
}

.contact-details__right::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 4px;
    background: #e60023;
}

.contact-details__right .section-title {
    margin-bottom: 0 !important;
}

.contact-details__right .title {
    margin-bottom: 14px;
    color: #050505;
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.08;
}

.contact-details__lead {
    max-width: 430px;
    margin: 0;
    color: #606873;
    font-size: 16px;
    line-height: 1.7;
}

.contact-details__info {
    display: flex;
    flex-direction: column;
    margin-top: 26px;
    padding: 0;
}

.contact-details__info li {
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr);
    align-items: flex-start !important;
    gap: 18px;
    padding: 22px 0;
    border-top: 1px solid rgba(17, 17, 17, 0.08);
}

.contact-details__info li:last-child {
    padding-bottom: 0;
}

.contact-details__info li .icon {
    flex: 0 0 52px;
    width: 52px !important;
    height: 52px !important;
    border-radius: 8px;
    background: rgba(230, 0, 35, 0.07) !important;
    color: #151515 !important;
    border: 1px solid rgba(230, 0, 35, 0.16);
    box-shadow: none;
}

.contact-details__info li .icon span {
    color: #e60023 !important;
    font-size: 19px !important;
    line-height: 1;
}

.contact-details__info li:hover .icon {
    background: #e60023 !important;
    border-color: #e60023;
    transform: translateY(-2px);
}

.contact-details__info li:hover .icon span {
    color: #ffffff !important;
}

.contact-details__info li .text {
    margin-left: 0 !important;
    min-width: 0;
}

.contact-details__info li .text h5 {
    color: #111111;
    font-size: 17px;
    line-height: 1.25;
    font-weight: 800;
    margin-bottom: 7px !important;
}

.contact-details__info li .text a,
.contact-details__info li .text span {
    display: inline-block;
    color: #5f6874 !important;
    font-size: 16px !important;
    line-height: 1.52;
    overflow-wrap: anywhere;
}

.contact-details__info li .myflex {
    gap: 2px;
}

.contact-details__info li .text a:hover {
    color: #e60023 !important;
}

.contact-details__right .sub-title {
    color: #e60023 !important;
    margin-bottom: 10px;
}

.contact-details__right .sub-title svg {
    color: #e60023;
    opacity: 0.78;
}

.map-section {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    line-height: 0;
    overflow: hidden;
    background: #f6f6f6;
}

.map-section iframe {
    display: block;
    width: 100%;
    height: min(64vh, 560px);
    min-height: 420px;
    border: 0;
}

@media (max-width: 767.98px) {
    .contact-details__right {
        margin-left: 0;
        padding: 28px 20px 30px;
    }
    .contact-details__right .title {
        font-size: clamp(1.8rem, 9vw, 2.25rem);
    }
    .contact-details__info li {
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 14px;
        padding: 18px 0 !important;
    }
    .contact-details__info li .icon {
        flex-basis: 44px;
        width: 44px !important;
        height: 44px !important;
    }
    .contact-details__info li .icon span {
        font-size: 16px !important;
    }
    .map-section iframe {
        height: 420px;
        min-height: 420px;
    }
}

@media (max-width: 991.98px) {
    .contact-details__right {
        margin-left: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .contact-form-block .contact-form-drop {
        opacity: 1 !important;
        transform: none !important;
        visibility: visible !important;
    }
}


/* SEO page — hero + audit form */

.seo-hero-section {
    position: relative;
    padding: 50px 0px;
    overflow: hidden;
}

.seo-hero-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.seo-hero-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(70px);
    opacity: 0.45;
}

.seo-hero-orb--1 {
    width: 420px;
    height: 420px;
    top: -120px;
    right: -80px;
}

.seo-hero-orb--2 {
    width: 320px;
    height: 320px;
    bottom: -100px;
    left: -60px;
    background: radial-gradient(circle, rgba(0, 0, 0, 0.06) 0%, transparent 70%);
}

.seo-hero-grid {
    position: absolute;
    inset: 0;
    background-size: 48px 48px;
}

.seo-hero-section .container {
    position: relative;
    z-index: 1;
}

.seo-hero-section .seo-hero-drop {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-56px);
    will-change: transform, opacity;
}

.seo-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.9rem;
    margin-bottom: 1.25rem;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #1a1a1a;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(230, 0, 35, 0.18);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
}

.seo-hero-badge-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #e60023;
    box-shadow: 0 0 0 4px rgba(230, 0, 35, 0.15);
    animation: seoHeroPulse 2s ease-in-out infinite;
}

@keyframes seoHeroPulse {
    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.15);
        opacity: 0.75;
    }
}

.seo-hero-title {
    font-size: clamp(1.85rem, 3.8vw, 2.75rem);
    line-height: 1.15;
    font-weight: 700;
    color: #111;
    margin-bottom: 1.5rem;
    letter-spacing: -0.02em;
}

.seo-hero-accent {
    color: #e60023;
}

.seo-hero-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.seo-hero-stat {
    flex: 1 1 140px;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
}

.seo-hero-stat strong {
    display: block;
    font-size: 1.35rem;
    line-height: 1.1;
    color: #e60023;
    font-weight: 700;
}

.seo-hero-stat span {
    font-size: 0.78rem;
    color: #666;
    margin-top: 0.2rem;
    display: block;
}

.seo-hero-text {
    color: #444;
    font-size: 1rem;
    line-height: 1.75;
    margin-bottom: 1.75rem;
}

.seo-hero-text p {
    margin-bottom: 1rem;
}

.seo-hero-text p:last-child {
    margin-bottom: 0;
}

.seo-hero-text strong {
    color: #111;
    font-weight: 600;
}

.seo-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    align-items: center;
}

.seo-hero-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-width: 160px;
    padding: 0.95rem 1.6rem;
    border-radius: 12px;
    font-weight: 600;
    font-size: 1rem;
    text-decoration: none;
    color: #fff;
    background: linear-gradient(135deg, #e60023 0%, #c4001e 100%);
    box-shadow: 0 14px 32px rgba(230, 0, 35, 0.28);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.seo-hero-cta:hover {
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 18px 40px rgba(230, 0, 35, 0.35);
}

.seo-hero-cta--ghost {
    background: #fff;
    color: #111;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

.seo-hero-cta--ghost:hover {
    color: #e60023;
    border-color: rgba(230, 0, 35, 0.35);
}

.seo-audit-card {
    position: relative;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}

.seo-audit-card-glow {
    position: absolute;
    inset: -3px;
    border-radius: 26px;
    background: linear-gradient(135deg, rgba(230, 0, 35, 0.35), rgba(0, 0, 0, 0.08), rgba(230, 0, 35, 0.2));
    opacity: 0.65;
    filter: blur(1px);
}

.seo-audit-card-inner {
    position: relative;
    padding: clamp(2rem, 4vw, 2.75rem) clamp(1.75rem, 3vw, 2.25rem);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.8);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.08), 0 1px 0 rgba(255, 255, 255, 0.9) inset;
    backdrop-filter: blur(12px);
}

.seo-audit-card-tag {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #e60023;
    background: rgba(230, 0, 35, 0.08);
    padding: 0.3rem 0.65rem;
    border-radius: 6px;
    margin-bottom: 0.65rem;
}

.seo-audit-card-head {
    margin-bottom: 0.5rem;
}

.seo-audit-card-title {
    font-size: clamp(1.35rem, 2.5vw, 1.65rem);
    font-weight: 700;
    color: #e60023;
    margin-bottom: 0.5rem;
    line-height: 1.25;
}

.seo-audit-card-sub {
    font-size: 0.9rem;
    color: #666;
    margin-bottom: 1.75rem;
    line-height: 1.6;
}

.seo-audit-form {
    display: flex;
    flex-direction: column;
    gap: 1.35rem;
}

.seo-audit-field {
    position: relative;
}

.seo-audit-field input {
    width: 100%;
    min-height: 72px;
    padding: 1.75rem 1rem 0.75rem;
    border-radius: 12px;
    border: 1px solid #e2e2e2;
    background: #fafafa;
    font-size: 0.95rem;
    color: #111;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.seo-audit-field input:focus {
    outline: none;
    border-color: #e60023;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(230, 0, 35, 0.1);
}

.seo-audit-field label {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.92rem;
    color: #888;
    pointer-events: none;
    transition: all 0.2s ease;
}

.seo-audit-field label span {
    color: #e60023;
}

.seo-audit-field input:focus+label,
.seo-audit-field input:not(:placeholder-shown)+label {
    top: 0.7rem;
    transform: none;
    font-size: 0.72rem;
    color: #e60023;
    font-weight: 600;
}

.seo-audit-note {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    font-size: 0.78rem;
    color: #777;
    margin: 0.25rem 0 0.5rem;
    line-height: 1.5;
    padding-top: 0.25rem;
}

.seo-audit-note svg {
    flex-shrink: 0;
    margin-top: 2px;
    color: #e60023;
}

.seo-audit-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    align-self: flex-start;
    margin-top: 0.75rem;
    min-height: 58px;
    padding: 1rem 1.85rem;
    border: none;
    border-radius: 12px;
    font-weight: 600;
    font-size: 1rem;
    color: #fff;
    background: linear-gradient(135deg, #e60023 0%, #c4001e 100%);
    box-shadow: 0 12px 28px rgba(230, 0, 35, 0.25);
    cursor: pointer;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.seo-audit-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 36px rgba(230, 0, 35, 0.32);
}

@media (max-width: 991.98px) {
    .seo-audit-card {
        margin-top: 0.5rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .seo-hero-section .seo-hero-drop {
        opacity: 1 !important;
        transform: none !important;
        visibility: visible !important;
    }
    .seo-hero-badge-dot {
        animation: none;
    }
}


/* SEO page — why SEO (reference layout) */

.seo-why-section {
    padding: 40px 0px;
}

.seo-why-inner {
    margin: 0 auto;
}

.seo-why-title {
    text-align: center;
    font-size: clamp(1.75rem, 3.2vw, 2.35rem);
    font-weight: 700;
    color: #111;
    line-height: 1.25;
    margin-bottom: clamp(2rem, 4vw, 2.75rem);
}

.seo-why-text {
    font-size: 1rem;
    line-height: 1.85;
    color: #555;
    margin-bottom: 1.35rem;
    text-align: left;
}

.seo-why-text--last {
    margin-bottom: 0;
    margin-top: 1.35rem;
}

.seo-why-lead {
    font-size: 1rem;
    line-height: 1.85;
    color: #555;
    margin: 1.5rem 0 1rem;
    text-align: left;
}

.seo-why-lead strong {
    font-weight: 700;
    color: #444;
}


/* Shared red check list */

.seo-why-list,
.seo-check-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.seo-why-list li,
.seo-check-list li {
    position: relative;
    font-size: 1rem;
    line-height: 1.85;
    color: #555;
    margin-bottom: 0.65rem;
    padding-left: 1.75rem;
    text-align: left;
}

.seo-why-list li::before,
.seo-check-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.28em;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    background: #d9d9d9 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 12.5l3.5 3.5L18 8' stroke='%23e60023' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 0.85rem no-repeat;
}

.seo-why-list li:last-child,
.seo-check-list li:last-child {
    margin-bottom: 0;
}


/* SEO page — services grid (minimal + attractive) */

.seo-svc-rail-section {
    position: relative;
    padding: 15px 0px;
    overflow: hidden;
}

.seo-svc-rail-section::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -80px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    pointer-events: none;
}

.seo-svc-rail-head {
    position: relative;
    z-index: 1;
    text-align: center;
    max-width: 36rem;
    margin: 0 auto 2.5rem;
}

.seo-svc-rail-eyebrow {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #e60023;
    margin-bottom: 0.75rem;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: rgba(230, 0, 35, 0.08);
    border: 1px solid rgba(230, 0, 35, 0.12);
}

.seo-svc-rail-title {
    font-size: clamp(1.55rem, 2.8vw, 2.1rem);
    font-weight: 500;
    color: #141414;
    line-height: 1.2;
    letter-spacing: -0.025em;
    margin: 0 0 0.7rem;
}

.seo-svc-rail-intro {
    font-size: 0.96rem;
    font-weight: 400;
    line-height: 1.65;
    color: #6b6b6b;
    margin: 0;
}

.seo-svc-rail-grid {
    position: relative;
    z-index: 1;
}

.seo-svc-rail-track {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 576px) {
    .seo-svc-rail-track {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    .seo-svc-rail-track {
        grid-template-columns: repeat(3, 1fr);
        gap: 1.15rem;
    }
}

.seo-svc-card {
    width: 100%;
    padding: 1.4rem 1.3rem 1.3rem;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 14px;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
    position: relative;
    overflow: hidden;
}

.seo-svc-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #e60023, #ff4d6a);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.4s ease;
}

.seo-svc-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(230, 0, 35, 0.03) 0%, transparent 55%);
    opacity: 0;
    transition: opacity 0.35s ease;
    pointer-events: none;
}

.seo-svc-card:hover {
    transform: translateY(-5px);
    border-color: rgba(230, 0, 35, 0.2);
}

.seo-svc-card:hover::before {
    transform: scaleX(1);
}

.seo-svc-card:hover::after {
    opacity: 1;
}

.seo-svc-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.seo-svc-card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    color: #e60023;
    background: rgba(230, 0, 35, 0.08);
    border: 1px solid rgba(230, 0, 35, 0.12);
    transition: transform 0.35s ease, background 0.35s ease;
}

.seo-svc-card-icon svg {
    width: 22px;
    height: 22px;
}

.seo-svc-card:hover .seo-svc-card-icon {
    transform: scale(1.08);
    background: rgba(230, 0, 35, 0.14);
}

.seo-svc-card-index {
    font-size: 0.68rem;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #bbb;
}

.seo-svc-card-title {
    font-size: 27px;
    font-weight: 500;
    color: #1a1a1a;
    line-height: 1.35;
    margin: 0 0 0.9rem;
    transition: color 0.3s ease;
}

.seo-svc-card:hover .seo-svc-card-title {
    color: #e60023;
}

.seo-svc-card-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.seo-svc-card-list li {
    position: relative;
    padding-left: 1rem;
    font-size: 0.84rem;
    font-weight: 400;
    line-height: 1.55;
    color: #777;
    margin-bottom: 0.4rem;
    transition: color 0.3s ease;
}

.seo-svc-card-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5em;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #e60023;
    opacity: 0.55;
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.seo-svc-card:hover .seo-svc-card-list li {
    color: #555;
}

.seo-svc-card:hover .seo-svc-card-list li::before {
    opacity: 1;
    transform: scale(1.15);
}

.seo-svc-card-list li:last-child {
    margin-bottom: 0;
}


/* SEO page — Why Choose (accordion + orbit) */

.seo-choose-head {
    text-align: center;
    max-width: 42rem;
    margin: 0 auto 2.75rem;
}

.seo-choose-eyebrow {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #e60023;
    margin-bottom: 0.65rem;
}

.seo-choose-title {
    font-size: clamp(1.45rem, 2.6vw, 2rem);
    font-weight: 500;
    color: #141414;
    line-height: 1.25;
    letter-spacing: -0.02em;
    margin: 0 0 0.75rem;
}

.seo-choose-lead {
    font-size: 0.96rem;
    font-weight: 400;
    line-height: 1.65;
    color: #666;
    margin: 0;
}

.seo-choose-layout {
    display: none !important;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.42fr);
    gap: 1.25rem;
    align-items: stretch;
}

.seo-choose-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.seo-choice-card {
    position: relative;
    min-height: 188px;
    padding: 1.35rem 1.35rem 1.25rem;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(20, 20, 20, 0.08);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 18px 45px rgba(20, 20, 20, 0.055);
    transition: transform 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease;
}

.seo-choice-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: #e60023;
    transform: scaleY(0.32);
    transform-origin: top;
    transition: transform 0.28s ease;
}

.seo-choice-card::after {
    content: "";
    position: absolute;
    right: -34px;
    top: -34px;
    width: 96px;
    height: 96px;
    border: 1px solid rgba(230, 0, 35, 0.12);
    border-radius: 50%;
}

.seo-choice-card:hover {
    transform: translateY(-5px);
    border-color: rgba(230, 0, 35, 0.22);
    box-shadow: 0 24px 55px rgba(20, 20, 20, 0.09);
}

.seo-choice-card:hover::before {
    transform: scaleY(1);
}

.seo-choice-card--wide {
    grid-column: span 2;
    min-height: 160px;
}

.seo-choice-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    height: 2.35rem;
    margin-bottom: 1rem;
    color: #e60023;
    background: rgba(230, 0, 35, 0.08);
    border: 1px solid rgba(230, 0, 35, 0.14);
    border-radius: 50%;
    font-size: 0.78rem;
    font-weight: 600;
}

.seo-choice-card h3 {
    margin: 0 0 0.55rem;
    color: #141414;
    font-size: clamp(1rem, 1.7vw, 1.16rem);
    font-weight: 600;
    line-height: 1.35;
}

.seo-choice-card p {
    margin: 0;
    color: #626262;
    font-size: 0.92rem;
    line-height: 1.7;
}

.seo-choose-panel {
    position: sticky;
    top: 100px;
    align-self: start;
    min-height: 100%;
    padding: 1.4rem;
    color: #fff;
    background: #151515;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.16);
}

.seo-choose-panel::before {
    content: "";
    position: absolute;
    inset: -80px -80px auto auto;
    width: 220px;
    height: 220px;
    background: radial-gradient(circle, rgba(230, 0, 35, 0.45), transparent 62%);
}

.seo-choose-panel-top {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    margin-bottom: 1.4rem;
}

.seo-choose-panel-top span {
    color: rgba(255, 255, 255, 0.66);
    font-size: 0.74rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.seo-choose-panel-top strong {
    color: #fff;
    font-size: clamp(1.35rem, 2.5vw, 2rem);
    font-weight: 600;
    line-height: 1.18;
}

.seo-growth-loop {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.35rem;
}

.seo-growth-loop span {
    min-height: 86px;
    display: flex;
    align-items: end;
    padding: 0.85rem;
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    font-size: 0.92rem;
    font-weight: 600;
}

.seo-growth-loop span:nth-child(2),
.seo-growth-loop span:nth-child(3) {
    background: rgba(230, 0, 35, 0.16);
}

.seo-choose-points {
    position: relative;
    display: grid;
    gap: 0.8rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.seo-choose-points li {
    display: grid;
    gap: 0.25rem;
    padding: 0 0 0.8rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.seo-choose-points li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.seo-choose-points strong {
    color: #fff;
    font-size: 0.95rem;
    font-weight: 600;
}

.seo-choose-points span {
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.86rem;
    line-height: 1.55;
}

.seo-choose-body {
    display: flex !important;
}

@media (max-width: 1199.98px) {
    .seo-choose-layout {
        grid-template-columns: 1fr;
    }
    .seo-choose-panel {
        position: relative;
        top: auto;
    }
}

@media (max-width: 767.98px) {
    .seo-choose-section {
        padding: 34px 0 44px;
    }
    .seo-choose-head {
        text-align: left;
        margin-bottom: 1.5rem;
    }
    .seo-choose-grid {
        grid-template-columns: 1fr;
    }
    .seo-choice-card,
    .seo-choice-card--wide {
        grid-column: auto;
        min-height: auto;
    }
    .seo-choice-card {
        padding: 1.2rem 1.15rem;
    }
    .seo-growth-loop {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 420px) {
    .seo-growth-loop {
        grid-template-columns: 1fr;
    }
    .seo-growth-loop span {
        min-height: 64px;
    }
}

.seo-choose-accordion {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.seo-acc-item {
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 14px;
    background: #fafafa;
    overflow: hidden;
    transition: border-color 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
}

.seo-acc-item.is-open {
    background: #fff;
    border-color: rgba(230, 0, 35, 0.25);
    box-shadow: 0 10px 32px rgba(230, 0, 35, 0.08);
}

.seo-acc-btn {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.15rem 1.25rem;
    border: none;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.seo-acc-marker {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    border-radius: 3px;
    background: #ddd;
    transition: background 0.3s ease, transform 0.3s ease;
}

.seo-acc-item.is-open .seo-acc-marker {
    transform: scale(1.1);
}

.seo-acc-label {
    flex: 1;
    font-size: 1rem;
    font-weight: 500;
    color: #222;
    line-height: 1.4;
}

.seo-acc-item.is-open .seo-acc-label {
    color: #e60023;
}

.seo-acc-chevron {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    border-right: 1.5px solid #999;
    border-bottom: 1.5px solid #999;
    transform: rotate(45deg);
    transition: transform 0.3s ease, border-color 0.3s ease;
    margin-top: -4px;
}

.seo-acc-item.is-open .seo-acc-chevron {
    transform: rotate(-135deg);
    margin-top: 4px;
    border-color: #e60023;
}

.seo-acc-panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.35s ease, padding-bottom 0.35s ease;
    padding-bottom: 0;
}

.seo-acc-item.is-open .seo-acc-panel {
    grid-template-rows: 1fr;
    padding-bottom: 1.25rem;
}

.seo-acc-panel>p {
    overflow: hidden;
    margin: 0;
    padding: 0.25rem 1.5rem 0.25rem 2.5rem;
    font-size: 0.92rem;
    font-weight: 400;
    line-height: 1.75;
    color: #666;
}

.seo-choose-visual {
    padding: 2rem 1.5rem;
    background: #fafafa;
    border-radius: 20px;
    border: 1px solid rgba(0, 0, 0, 0.06);
}


/* Orbit infographic */

.seo-orbit-wrap {
    display: flex;
    justify-content: center;
    padding: 1rem 0;
}

.seo-orbit {
    position: relative;
    width: min(100%, 380px);
    aspect-ratio: 1;
    margin: 0 auto;
}

.seo-orbit-ring {
    position: absolute;
    inset: 8%;
    border: 1px dashed rgba(230, 0, 35, 0.35);
    border-radius: 50%;
    animation: seoOrbitSpin 48s linear infinite;
}

.seo-orbit-ring::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: 50%;
    border: 1px solid transparent;
    border-top-color: rgba(230, 0, 35, 0.5);
}

@keyframes seoOrbitSpin {
    to {
        transform: rotate(360deg);
    }
}

.seo-orbit-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 42%;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(230, 0, 35, 0.15);
    z-index: 2;
}

.seo-orbit-center-icon {
    width: 72%;
    height: auto;
}

.seo-orbit-nodes {
    position: absolute;
    inset: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.seo-orbit-node {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    transform: rotate(calc(var(--i) * 45deg)) translateY(min(-42vw, -155px)) rotate(calc(var(--i) * -45deg));
}

.seo-orbit-node-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    width: 72px;
    margin-left: -36px;
    margin-top: -28px;
    padding: 0.5rem;
    text-align: center;
}

.seo-orbit-node-inner svg {
    width: 26px;
    height: 26px;
    color: #e60023;
}

.seo-orbit-node-inner em {
    font-style: normal;
    font-size: 0.62rem;
    font-weight: 500;
    line-height: 1.2;
    color: #e60023;
    letter-spacing: 0.02em;
}

@media (min-width: 992px) {
    .seo-orbit-node {
        transform: rotate(calc(var(--i) * 45deg)) translateY(-155px) rotate(calc(var(--i) * -45deg));
    }
}

@media (max-width: 991.98px) {
    .seo-choose-visual {
        margin-top: 1.5rem;
        padding: 1.75rem 1.25rem;
    }
    .seo-choose-accordion {
        gap: 0.75rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .seo-orbit-ring {
        animation: none;
    }
}

.work-process-content-1 {
    display: flex;
    justify-content: space-around;
}

ul.page-breadcrumb li {
    text-shadow: 1px 1px 2px #000;
}

.page-title .page-breadcrumb,
.page-title .page-breadcrumb-outer {
    display: none !important;
}


/* SEO page - minimal Why Choose section */

.seo-choose-section {
    position: relative;
    overflow: hidden;
}

.seo-choose-section::before,
.seo-choose-section::after {
    display: none;
}

.seo-choose-head {
    max-width: 720px;
    margin: 0 auto 38px;
    text-align: center;
}

.seo-choose-eyebrow {
    display: inline-block;
    margin-bottom: 10px;
    color: #e60023;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.seo-choose-eyebrow::before {
    display: none;
}

.seo-choose-title {
    max-width: 620px;
    margin: 0 auto 12px;
    color: #151515;
    font-size: clamp(1.55rem, 3vw, 2.35rem);
    font-weight: 650;
    line-height: 1.18;
    letter-spacing: 0;
}

.seo-choose-lead {
    max-width: 660px;
    margin: 0 auto;
    color: #626262;
    font-size: 0.98rem;
    line-height: 1.7;
}

.seo-choose-body {
    display: block !important;
    /* max-width: 980px; */
    margin: 0 auto;
}

.seo-choose-body>[class*="col-"] {
    width: 100%;
    max-width: none;
    flex: initial;
    padding: 0;
}

.seo-choose-body>[class*="col-"]:first-child {
    order: initial;
}

.seo-choose-body>[class*="col-"]:last-child {
    order: initial;
}

.seo-choose-accordion {
    counter-reset: seo-choice;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    width: 100%;
}

.seo-acc-item {
    position: relative;
    overflow: hidden;
    min-height: 130px;
    border: 1px solid rgba(29, 29, 29, 0.1);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: none;
    transition: border-color 0.25s ease, background 0.25s ease;
}

.seo-acc-item:last-child {
    grid-column: span 2;
    min-height: auto;
}

.seo-acc-item::before {
    display: none;
}

.seo-acc-item::after {
    content: counter(seo-choice, decimal-leading-zero);
    counter-increment: seo-choice;
    position: absolute;
    top: 18px;
    right: 20px;
    color: #d8d8d8;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1;
    pointer-events: none;
}

.seo-acc-item:hover,
.seo-acc-item.is-open {
    transform: none;
    border-color: rgba(230, 0, 35, 0.28);
    background: #fffdfd;
    box-shadow: none;
}

.seo-acc-btn {
    position: relative;
    z-index: 1;
    align-items: flex-start;
    gap: 12px;
    padding: 18px 58px 8px 20px;
    cursor: pointer;
}

.seo-acc-marker {
    flex: 0 0 auto;
    width: 8px;
    height: 8px;
    margin-top: 7px;
    border-radius: 2px;
    background: #d9d9d9;
    border: none;
    box-shadow: none;
}

.seo-acc-item.is-open .seo-acc-marker {
    transform: none;
}

.seo-acc-label {
    color: #151515;
    font-size: 1rem;
    font-weight: 650;
    line-height: 1.35;
}

.seo-acc-item.is-open .seo-acc-label {
    color: #151515;
}

.seo-acc-chevron {
    display: none;
}

.seo-acc-panel,
.seo-acc-item.is-open .seo-acc-panel {
    display: block;
    padding-bottom: 0;
}

.seo-acc-panel>p {
    overflow: visible;
    margin: 0;
    padding: 0 22px 20px 40px;
    color: #666666;
    font-size: 0.9rem;
    line-height: 1.68;
}

.seo-choose-visual {
    position: sticky;
    top: 100px;
    overflow: hidden;
    min-height: 430px;
    display: grid;
    place-items: center;
    padding: 22px;
    border: 1px solid rgba(29, 29, 29, 0.1);
    border-radius: 8px;
    background: #fbfbfb;
    box-shadow: none;
}

.seo-choose-visual {
    justify-self: start;
    width: 100%;
    max-width: 420px;
}

.seo-choose-visual::before,
.seo-choose-visual::after {
    display: none;
}

.seo-orbit-wrap {
    width: 100%;
    padding: 0;
}

.seo-orbit {
    width: min(100%, 350px);
}

.seo-orbit-ring {
    inset: 8%;
    border-color: rgba(230, 0, 35, 0.22);
    animation-duration: 70s;
}

.seo-orbit-ring::before {
    border-top-color: rgba(230, 0, 35, 0.42);
}

.seo-orbit-center {
    width: 40%;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: none;
    border-color: rgba(230, 0, 35, 0.18);
}

.seo-orbit-node-inner {
    width: 70px;
    margin-left: -35px;
    padding: 0;
}

.seo-orbit-node-inner svg {
    width: 24px;
    height: 24px;
    color: #e60023;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
}

.seo-orbit-node-inner em {
    color: #e60023;
    font-size: 0.6rem;
    font-weight: 650;
}

@media (min-width: 992px) {
    .seo-orbit-node {
        transform: rotate(calc(var(--i) * 45deg)) translateY(-142px) rotate(calc(var(--i) * -45deg));
    }
}

@media (max-width: 1199.98px) {
    .seo-choose-body {
        max-width: 920px;
    }
    .seo-choose-body>[class*="col-"]:first-child,
    .seo-choose-body>[class*="col-"]:last-child {
        order: initial;
    }
    .seo-choose-visual {
        position: relative;
        top: auto;
        min-height: 390px;
        max-width: none;
    }
}

@media (max-width: 767.98px) {
    .seo-choose-section {
        padding: 44px 0;
    }
    .seo-choose-head {
        margin-bottom: 24px;
        text-align: left;
    }
    .seo-choose-title,
    .seo-choose-lead {
        margin-left: 0;
        margin-right: 0;
    }
    .seo-choose-accordion {
        grid-template-columns: 1fr;
    }
    .seo-acc-item,
    .seo-acc-item:last-child {
        grid-column: auto;
        min-height: auto;
    }
    .seo-acc-btn {
        padding: 16px 54px 8px 18px;
    }
    .seo-acc-panel>p {
        padding: 0 18px 18px 38px;
    }
    .seo-choose-visual {
        min-height: 330px;
        padding: 18px 8px;
    }
    .seo-orbit {
        width: min(100%, 292px);
    }
    .seo-orbit-node {
        transform: rotate(calc(var(--i) * 45deg)) translateY(-118px) rotate(calc(var(--i) * -45deg));
    }
    .seo-orbit-node-inner {
        width: 58px;
        margin-left: -29px;
    }
    .seo-orbit-node-inner svg {
        width: 21px;
        height: 21px;
    }
    .seo-orbit-node-inner em {
        font-size: 0.52rem;
    }
}


/* SEO Industries Tabs Layout */

.seo-industries-section {
    padding: 30px 0px;
}

.ind-tabs-container {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    margin-top: 3rem;
}


/* Horizontal tabs on top — content below */

.ind-tabs-container.horizontal-tb {
    flex-direction: column;
    gap: 1.75rem;
}

.ind-tabs-container.horizontal-tb .ind-tabs-sidebar {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 0.65rem;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    padding-bottom: 0.35rem;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.ind-tabs-container.horizontal-tb .ind-tab-btn {
    flex: 0 1 auto;
    padding: 0.85rem 1.15rem;
    font-size: 0.92rem;
    gap: 0.5rem;
    text-align: center;
    justify-content: center;
    white-space: nowrap;
}

.ind-tabs-container.horizontal-tb .ind-tab-btn.active {
    transform: none;
}

.ind-tabs-container.horizontal-tb .ind-tabs-content {
    width: 100%;
    flex: none;
    min-height: 320px;
}

@media (min-width: 768px) {
    .ind-tabs-container.horizontal-tb .ind-tabs-sidebar {
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 0.75rem;
    }
    .ind-tabs-container.horizontal-tb .ind-tab-btn {
        padding: 0.9rem 1.35rem;
        font-size: 0.98rem;
    }
}

.ind-tabs-sidebar {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    gap: 0.5rem;
    padding-bottom: 1rem;
    max-width: 100%;
    width: 100%;
}

.ind-tabs-sidebar::-webkit-scrollbar {
    height: 4px;
}

.ind-tabs-sidebar::-webkit-scrollbar-thumb {
    background: #ddd;
    border-radius: 4px;
}

.ind-tab-btn {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.15rem 1.5rem;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 12px;
    font-size: 1.05rem;
    font-weight: 500;
    color: #444;
    cursor: pointer;
    text-align: left;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.ind-tab-btn:hover {
    border-color: rgba(230, 0, 35, 0.3);
    background: #fffafb;
    color: #e60023;
}

.ind-tab-btn.active {
    background: #262626;
    color: #fff;
    transform: translateY(-2px);
}

.ind-icon {
    font-size: 1.35rem;
}

.ind-tabs-content {
    flex: 1;
    position: relative;
    min-height: 400px;
}

.ind-tab-pane {
    display: none;
    animation: fade-in-up 0.4s ease forwards;
}

.ind-tab-pane.active {
    display: block;
}

@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.ind-pane-card {
    background: #fff;
    border-radius: 20px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    overflow: hidden;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
}

@media (min-width: 768px) {
    .ind-pane-card {
        flex-direction: row;
        align-items: stretch;
    }
}

.ind-pane-image {
    width: 100%;
    height: 200px;
    background: #fdfdfd;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}

@media (min-width: 768px) {
    .ind-pane-image {
        width: 35%;
        height: auto;
        min-height: 240px;
        border-bottom: none;
        border-right: 1px solid rgba(0, 0, 0, 0.04);
    }
}

.ind-pane-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform 0.6s ease;
}

.ind-pane-card:hover .ind-pane-image img {
    transform: scale(1.05);
}

.ind-pane-text {
    padding: 2rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@media (min-width: 768px) {
    .ind-pane-text {
        padding: 3rem;
    }
}

.ind-pane-text h3 {
    font-size: 1.65rem;
    font-weight: 600;
    color: #111;
    margin-bottom: 1rem;
}

.ind-pane-text p {
    font-size: 1.05rem;
    line-height: 1.7;
    color: #555;
    margin: 0;
}


/* SEO Client Rankings — minimal */

.seo-rank-section {
    padding: 50px 0px;
}

.seo-rank-head {
    max-width: 36rem;
    margin: 0 auto 2.5rem;
}

.seo-rank-lead {
    margin: 0.5rem auto 0;
    font-size: 0.95rem;
    line-height: 1.6;
    color: #777;
}

.seo-rank-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 576px) {
    .seo-rank-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1200px) {
    .seo-rank-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 1.1rem;
    }
}

.seo-rank-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    text-align: left;
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 12px;
    padding: 1.25rem 1rem 1rem;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.seo-rank-card:hover {
    border-color: #d8d8d8;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.04);
}

.seo-rank-logo-wrap {
    display: grid;
    place-items: center;
    align-self: stretch;
    width: 100%;
    min-height: 52px;
    margin-bottom: 0.85rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid #f0f0f0;
    text-align: center;
}

.seo-rank-logo-wrap img {
    display: block;
    max-width: 130px;
    max-height: 48px;
    width: auto;
    height: auto;
    margin-inline: auto;
    object-fit: contain;
}

.seo-rank-name {
    margin: 0 0 0.85rem;
    font-size: 0.92rem;
    font-weight: 600;
    line-height: 1.35;
    color: #1a1a1a;
}

.seo-rank-list {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    text-align: left;
}

.seo-rank-list li {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid #f3f3f3;
}

.seo-rank-list li:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.seo-rank-kw {
    flex: 1;
    font-size: 0.76rem;
    line-height: 1.45;
    color: #666;
}

.seo-rank-num {
    flex-shrink: 0;
    min-width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    background: #f2f2f2;
    color: #333;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1;
}

.seo-rank-list li:first-child .seo-rank-num {
    background: #1a1a1a;
    color: #fff;
}


/* Mobile / tablet header (≤1199px — desktop nav hidden) */

@media (max-width: 1199.98px) {
    .main-header .header-lower .main-box {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        flex-wrap: nowrap !important;
        gap: 12px !important;
    }
    .main-header .logo {
        max-width: 120px !important;
        width: 120px !important;
        min-width: 120px !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .main-header .logo img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        display: block !important;
    }
    .main-header .nav-outer {
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        margin-left: auto !important;
        width: auto !important;
    }
    .main-header .outer-box {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 14px !important;
        width: auto !important;
        flex-wrap: nowrap !important;
    }
    .main-header .ui-btn-outer {
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
    }
    .main-header .ui-btn-search {
        display: flex !important;
        align-items: center !important;
    }
    .main-header .contact-btn {
        min-width: 118px !important;
        height: 40px !important;
        padding: 0 !important;
        margin: 0 !important;
        display: inline-flex !important;
    }
    .main-header .contact-btn::before,
    .main-header .contact-btn::after {
        font-size: 12px !important;
    }
    .main-header .search-toggler {
        display: none !important;
    }
    .main-header .mobile-nav-toggler {
        margin: 0 !important;
        flex: 0 0 auto !important;
        align-self: center !important;
    }
}

@media (max-width: 575px) {
    .main-header .logo {
        max-width: 100px !important;
        width: 100px !important;
        min-width: 100px !important;
        flex: 0 0 100px !important;
    }
    .main-header .contact-btn {
        min-width: 108px !important;
        height: 38px !important;
        padding: 0 !important;
    }
    .main-header .contact-btn::before,
    .main-header .contact-btn::after {
        font-size: 11px !important;
    }
}


/* Global safeguard against horizontal overflow on mobile */

html,
body {
    overflow-x: hidden;
    max-width: 100vw;
}

.page-wrapper {
    overflow-x: hidden;
}

.smm-service-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
    border-bottom: 3px solid #ef4444;
}

.smm-service-card:hover img {
    transform: scale(1.08);
}

.smm-service-card:hover h3 {
    color: #667eea;
}

@media (max-width: 991px) {
    .smm-services-section h2 {
        font-size: 36px;
    }
}

@media (max-width: 767px) {
    .smm-services-section h2 {
        font-size: 32px;
    }
    .smm-service-card {
        margin-bottom: 24px;
    }
}

.why-social-section {
    position: relative;
    padding: 0px 20px;
    padding-bottom: 40px !important;
    overflow: hidden;
}

.why-social-container {
    max-width: 1320px;
    margin: auto;
}


/* MAIN BOX */

.why-social-box {
    position: relative;
    background: linear-gradient( 145deg, rgba(255, 255, 255, 1), rgba(248, 248, 248, 1));
    border-radius: 40px;
    padding: 70px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.why-social-box::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -120px;
    width: 260px;
    height: 260px;
    background: rgba(230, 0, 35, 0.05);
    border-radius: 50%;
}

.why-social-box::after {
    content: "";
    position: absolute;
    bottom: -100px;
    left: -100px;
    width: 220px;
    height: 220px;
    background: rgba(29, 29, 29, 0.03);
    border-radius: 50%;
}


/* CONTENT */

.why-social-content {
    position: relative;
    z-index: 2;
}

.why-social-content h2 {
    color: #1d1d1d;
    margin-bottom: 28px;
    text-align: center;
}

.why-social-text {
    color: #666;
    line-height: 2;
    margin-bottom: 50px;
    text-align: center;
}


/* GRID */

.why-social-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
    margin-bottom: 50px;
}


/* ITEM */

.why-social-item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 24px 26px;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 22px;
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: 0.4s ease;
    backdrop-filter: blur(12px);
}

.why-social-item:hover {
    transform: translateY(-6px);
    border-color: rgba(230, 0, 35, 0.14);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.05);
}


/* ICON */

.why-social-icon {
    min-width: 16px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #e60023;
    position: relative;
}

.why-social-icon::before {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
}


/* TEXT */

.why-social-item p {
    color: #1d1d1d;
    line-height: 1.7;
    margin: 0;
}

.why-social-bottom {
    color: #666;
    line-height: 2;
    text-align: center;
    margin: 0;
}


/* RESPONSIVE */

@media(max-width:991px) {
    .why-social-box {
        padding: 50px 35px;
    }
    .why-social-grid {
        grid-template-columns: 1fr;
    }
}

@media(max-width:768px) {
    .why-social-section {
        padding: 40px 18px;
    }
    .why-social-box {
        padding: 40px 24px;
        border-radius: 30px;
    }
    .why-social-text,
    .why-social-bottom {
        line-height: 1.9;
    }
    .why-social-item {
        padding: 20px;
        gap: 14px;
    }
}

.smm-approach-section {
    position: relative;
    padding: 0px 20px;
    overflow: hidden;
}

.smm-approach-container {
    max-width: 1350px;
    margin: auto;
}


/* GRID */

.smm-approach-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    align-items: stretch;
}


/* CARD */

.smm-approach-card {
    position: relative;
    padding: 38px;
    background: #fff;
    border-radius: 32px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    overflow: hidden;
    transition: 0.45s ease;
    box-shadow: 0 15px 45px rgba(0, 0, 0, 0.04);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.smm-approach-card:hover {
    transform: translateY(-12px);
    border-color: rgba(230, 0, 35, 0.14);
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.08);
}


/* ICON STYLE */

.smm-icon-wrap {
    position: relative;
    width: fit-content;
    margin-bottom: 28px;
}

.smm-icon-wrap::before {
    content: "";
    position: absolute;
    top: -10px;
    left: -10px;
    width: 72px;
    height: 72px;
    border-radius: 24px;
    border: 1px dashed rgba(230, 0, 35, 0.4);
    transition: 0.4s ease;
}

.smm-approach-icon {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    background: #1d1d1d;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.4s ease;
    position: relative;
    z-index: 2;
}

.smm-approach-icon i {
    font-size: 20px;
}

.smm-approach-card:hover .smm-icon-wrap::before {
    transform: rotate(12deg);
    border-color: #e60023;
}

.smm-approach-card:hover .smm-approach-icon {
    background: #e60023;
    transform: translate(6px, -6px);
}


/* CONTENT */

.smm-approach-content h3 {
    color: #1d1d1d;
    line-height: 1.3;
    margin-bottom: 18px;
}

.smm-approach-content p {
    color: #666;
    line-height: 1.9;
    margin: 0;
}


/* TOP BORDER */

.smm-approach-card::after {
    content: "";
    position: absolute;
    top: 0;
    left: 38px;
    width: calc(100% - 76px);
    height: 3px;
    background: #e60023;
    transform: scaleX(0);
    transform-origin: left;
    transition: 0.5s ease;
}

.smm-approach-card:hover::after {
    transform: scaleX(1);
}


/* RESPONSIVE */

@media(max-width:1200px) {
    .smm-approach-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media(max-width:768px) {
    .smm-approach-section {
        padding: 80px 18px;
    }
    .smm-approach-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .smm-approach-card {
        padding: 30px 24px;
        border-radius: 26px;
    }
    .smm-approach-content p {
        line-height: 1.8;
    }
}


/* Cta line */

.smm-cta-section {
    position: relative;
    padding: 0px 20px;
    overflow: hidden;
}

.smm-cta-container {
    max-width: 1380px;
    margin: auto;
}


/* MAIN BOX */

.smm-cta-box {
    position: relative;
    border-radius: 40px;
    overflow: hidden;
    padding: 110px 70px;
    background: #1d1d1d;
    isolation: isolate;
}


/* OVERLAY */

.smm-cta-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #2e2e2e, rgba(0, 0, 0, 0.75));
    z-index: -1;
}


/* GLOW EFFECT */

.smm-cta-box::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -120px;
    width: 280px;
    height: 280px;
    filter: blur(80px);
    border-radius: 50%;
}

.smm-cta-box::after {
    content: "";
    position: absolute;
    bottom: -140px;
    left: -140px;
    width: 320px;
    height: 320px;
    background: rgba(255, 255, 255, 0.05);
    filter: blur(90px);
    border-radius: 50%;
}


/* CONTENT */

.smm-cta-content {
    position: relative;
    z-index: 2;
    max-width: 980px;
    margin: auto;
    text-align: center;
}


/* BADGE */

.smm-cta-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 22px;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(10px);
    color: #fff;
    margin-bottom: 28px;
}


/* HEADING */


/* TEXT */


/* BUTTON */


/* RESPONSIVE */

@media(max-width:991px) {
    .smm-cta-box {
        padding: 80px 40px;
    }
}

@media(max-width:768px) {
    .smm-cta-section {
        padding: 80px 18px;
    }
    .smm-cta-box {
        padding: 65px 24px;
        border-radius: 28px;
    }
}


/* =========================================
BEST ADVERTISING MANAGEMENT AGENCY SECTION 
========================================= */

.agency-min-section {
    position: relative;
    padding: 20px 20px;
    overflow: hidden;
}

.agency-min-container {
    max-width: 1320px;
    margin: auto;
}


/* GRID */

.agency-min-grid {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: 70px;
}

.agency-min-grid:not(:has(.agency-min-image-wrap)) {
    grid-template-columns: 1fr;
}


/* IMAGE WRAP */

.agency-min-image-wrap {
    position: relative;
    isolation: isolate;
    perspective: 1200px;
}


/* FLOATING GLOW */

.agency-min-image-wrap::before {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    top: -60px;
    left: -60px;
    filter: blur(20px);
    z-index: -2;
    animation: floatGlow 6s ease-in-out infinite;
}


/* ROTATING BORDER */

.agency-min-image-wrap::after {
    content: "";
    position: absolute;
    inset: -12px;
    border-radius: 42px;
    border: 1px dashed rgba(230, 0, 35, 0.25);
    z-index: -1;
    animation: rotateBorder 18s linear infinite;
}


/* IMAGE */

.agency-min-image {
    position: relative;
    border-radius: 32px;
    overflow: hidden;
    transform-style: preserve-3d;
    transition: transform 0.18s ease;
    will-change: transform;
}

.agency-min-image::before {
    content: "";
    position: absolute;
    inset: 0;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 32px;
    z-index: 2;
    pointer-events: none;
}

.agency-min-image::after {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 70%;
    height: 100%;
    background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    transform: skewX(-25deg);
    transition: 0.2s ease;
    z-index: 3;
}

.agency-min-image:hover::after {
    left: 140%;
}

.agency-min-image img {
    width: 100%;
    display: block;
    border-radius: 32px;
    /* transition में filter जोड़ा गया है ताकि कलर स्मूथली आए */
    transition: transform 0.25s ease, filter 0.4s ease;
    animation: imageFloat 5s ease-in-out infinite;
    /* डिफ़ॉल्ट रूप से ब्लैक एंड व्हाइट */
    /*filter: grayscale(100%);*/
}



@media (min-width: 992px) {
    .about-section .row.g-4 {
        align-items: stretch;
    }
    .about-section .agency-min-image-wrap {
        display: flex;
    }
    .about-section .agency-min-image {
        width: 100%;
        height: 100%;
        min-height: 100%;
    }
    .about-section .agency-min-image img {
        height: 100%;
        object-fit: cover;
    }
}


/* CONTENT */

.agency-min-content {
    position: relative;
}

@media (min-width: 1101px) {
    .graphic-designing-page .graphic-content-image-section .agency-min-grid {
        align-items: stretch;
    }

    .graphic-designing-page .graphic-content-image-section .agency-min-image-wrap {
        min-height: 0;
    }

    .graphic-designing-page .graphic-content-image-section .agency-min-image {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
    }

    .graphic-designing-page .graphic-content-image-section .agency-min-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .graphic-designing-page .graphic-content-image-section .saar-exp-img-col {
        position: relative;
        min-height: 0;
    }

    .graphic-designing-page .graphic-content-image-section .saar-exp-img-wrapper {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
    }

    .graphic-designing-page .graphic-company-title span {
        display: block;
        color: #1d1d1d !important;
    }
}

.agency-min-content h2 {
    color: #1d1d1d;
    line-height: 1.1;
    margin-bottom: 22px;
    letter-spacing: -1px;
}


/* TEXT */

.agency-min-text {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.agency-min-text p {
    color: #555;
    line-height: 1.95;
    margin: 0;
    padding-left: 5px;
    position: relative;
}


/* ANIMATIONS */

@keyframes imageFloat {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
    100% {
        transform: translateY(0px);
    }
}

@keyframes rotateBorder {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes floatGlow {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-20px);
    }
    100% {
        transform: translateY(0px);
    }
}


/* RESPONSIVE */

@media(max-width:1100px) {
    .agency-min-grid {
        grid-template-columns: 1fr;
        gap: 45px;
    }
    .agency-min-image-wrap {
        max-width: 700px;
        margin: auto;
    }
}

@media(max-width:768px) {
    .agency-min-section {
        padding: 15px 18px;
    }
    .agency-min-grid {
        gap: 35px;
    }
    .agency-min-image,
    .agency-min-image img,
    .agency-min-image::before {
        border-radius: 24px;
    }
    .agency-min-image-wrap::after {
        inset: -8px;
        border-radius: 30px;
    }
    .agency-min-text {
        gap: 18px;
        padding: 0px 13px;
    }
    .agency-min-text p {
        line-height: 1.85;
    }
}


/* =========================================
WHY CHOOSE SAAR SECTION
========================================= */


/* =========================================
COMMON EFFECT CLASSES
Use these classes anywhere:
.fx-img-shine-tilt, .fx-img-gray-hover, .fx-hover-shadow,
.fx-hover-line, .fx-fade-up, .fx-fade-right, .fx-fade-left, .fx-fade-down, .fx-fade-bottom
========================================= */

.fx-img-shine-tilt,
.fx-img-frame {
    position: relative;
    display: block;
    overflow: hidden;
    transform-style: preserve-3d;
    will-change: transform;
}

.fx-img-shine-tilt::after,
.fx-shine::after {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 70%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.38), transparent);
    transform: skewX(-25deg);
    transition: left 0.8s ease;
    z-index: 3;
    pointer-events: none;
}

.fx-img-shine-tilt:hover::after,
.fx-shine:hover::after {
    left: 140%;
}

.fx-img-shine-tilt img,
.fx-tilt-target {
    transition: transform 0.25s ease, filter 0.4s ease;
    will-change: transform;
}

.fx-img-gray-hover img,
img.fx-img-gray-hover,
.fx-gray-hover {
    /*filter: grayscale(100%);*/
    transition: filter 0.4s ease, transform 0.4s ease;
}

.fx-img-gray-hover:hover img,
/*img.fx-img-gray-hover:hover,*/
/*.fx-gray-hover:hover {*/
/*    filter: grayscale(0%);*/
/*}*/

.fx-hover-shadow {
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.fx-hover-shadow:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(0, 0, 0, 0.1);
}

.fx-hover-line {
    position: relative;
    overflow: hidden;
}

.fx-hover-line::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: #e60023;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.35s ease;
}

.fx-hover-line:hover::after {
    transform: scaleX(1);
}

.fx-reveal,
.fx-fade-up,
.fx-fade-right,
.fx-fade-left,
.fx-fade-down,
.fx-fade-bottom {
    opacity: 0;
    transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
    will-change: opacity, transform;
}

.fx-fade-up {
    transform: translateY(45px);
}

.fx-fade-right {
    transform: translateX(-45px);
}

.fx-fade-left {
    transform: translateX(45px);
}

.fx-fade-down {
    transform: translateY(-45px);
}

.fx-fade-bottom {
    transform: translateY(45px);
}

.fx-reveal.is-visible,
.fx-fade-up.is-visible,
.fx-fade-right.is-visible,
.fx-fade-left.is-visible,
.fx-fade-down.is-visible,
.fx-fade-bottom.is-visible {
    opacity: 1;
    transform: translate(0, 0);
}

.fx-delay-100 {
    transition-delay: 0.1s;
}

.fx-delay-200 {
    transition-delay: 0.2s;
}

.fx-delay-300 {
    transition-delay: 0.3s;
}

.fx-delay-400 {
    transition-delay: 0.4s;
}

.fx-delay-500 {
    transition-delay: 0.5s;
}

@media (prefers-reduced-motion: reduce) {
    .fx-reveal,
    .fx-fade-up,
    .fx-fade-right,
    .fx-fade-left,
    .fx-fade-down,
    .fx-fade-bottom {
        opacity: 1;
        transform: none;
        transition: none;
    }
}


/* Ads management tabs and FAQ page overrides */

.ads-management-page {
    background-color: #f6f6f6;
}

.ads-page-title {
    background-image: url('images/ads-banner.png');
}

.graphic-page-title {
    background-image: url('images/graphic-banner.png') !important;
}

.animation-page-title {
    background-image: url('images/animation-banner.png') !important;
}

.casestudy-page-title {
    background-image: url('images/case-studu-banner.png') !important;
}

.page-title {
    background-image:
        radial-gradient(circle at 15% 30%, rgba(230, 0, 35, 0.2), transparent 34%),
        radial-gradient(circle at 85% 70%, rgba(130, 0, 20, 0.16), transparent 38%),
        linear-gradient(135deg, #030303 0%, #0b0506 48%, #170307 100%) !important;
    background-color: #050505 !important;
}

.page-title::before {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0.38)) !important;
}

.ads-services-details {
    padding-top: 10px !important;
}

.ads-management-page .faq-content .accordion-box .block .acc-btn {
    color: #000000;
}

.ads-management-page .faq-content .accordion-box .block .acc-btn.active {
    color: #ffffff;
}

.ads-management-page .faq-content .accordion-box .block .acc-content .content .text {
    color: #000000;
}

.ads-management-page .faq-content .accordion-box li.accordion.block.active-block .acc-content .content .text {
    color: #ffffff !important;
}

.ads-management-page .ind-tab-group {
    display: flex;
    flex-direction: column;
}

.ads-management-page .ind-tab-group .ind-tab-btn {
    width: 100%;
}

.ads-management-page .ind-tab-group .ind-tab-pane {
    display: none;
    margin-top: 0;
}

.ads-management-page .ind-tab-group .ind-tab-pane.active {
    display: block;
}

.ads-management-page .ind-tabs-content-desktop {
    margin-top: 1.75rem;
}

.ads-management-page .ind-tabs-content-desktop .ind-tab-pane {
    display: none;
}

.ads-management-page .ind-tabs-content-desktop .ind-tab-pane.active {
    display: block;
}

@media (min-width: 768px) {
    .ads-management-page .ind-tabs-sidebar {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 0.65rem;
        overflow-x: auto;
    }
    .ads-management-page .ind-tab-group {
        flex: 0 0 auto;
    }
    .ads-management-page .ind-tab-group .ind-tab-pane {
        display: none !important;
    }
    .ads-management-page .ind-tabs-content-desktop {
        display: block;
    }
}

@media (max-width: 767.98px) {
    .ads-management-page .ind-tabs-sidebar {
        flex-direction: column;
        gap: 1rem;
    }
    .ads-management-page .ind-tabs-content-desktop {
        display: none !important;
    }
}


/* new 2nd section for ads management start */

.saar-why-section {
    position: relative;
    padding: 30px 20px;
    overflow: hidden;
}

.saar-why-container {
    max-width: 1320px;
    margin: auto;
}


/* TOP */

.saar-why-top {
    display: grid;
    gap: 30px;
    align-items: flex-start;
    margin-bottom: 70px;
}

.saar-why-title {
    display: flex;
    align-items: flex-start;
    gap: 18px;
}

.saar-why-title h2 {
    color: #1d1d1d;
    line-height: 1.1;
    letter-spacing: -1px;
    margin: 0;
}

.saar-why-top p {
    color: #666;
    line-height: 1.95;
    margin: 0;
}


/* GRID */

.saar-why-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
}


/* CARD */

.saar-why-card {
    position: relative;
    display: flex;
    gap: 24px;
    padding: 34px;
    border-radius: 28px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    transition: 0.45s ease;
    overflow: hidden;
}


/* 7th Card Full Width Feature */

.saar-why-card:nth-child(7) {
    grid-column: 1 / -1;
}

.saar-why-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(230, 0, 35, 0.03), transparent);
    opacity: 0;
    transition: 0.4s ease;
}

.saar-why-card:hover {
    transform: translateY(-8px);
    border-color: rgba(230, 0, 35, 0.12);
    box-shadow: 0 22px 50px rgba(0, 0, 0, 0.06);
}

.saar-why-card:hover::before {
    opacity: 1;
}


/* NUMBER */

.saar-why-number {
    min-width: 54px;
    height: 54px;
    border-radius: 16px;
    background: rgba(29, 29, 29, 0.04);
    color: #1d1d1d;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.4s ease;
    border: 1px solid rgba(0, 0, 0, 0.06);
    backdrop-filter: blur(10px);
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.saar-why-number::before {
    content: "";
    position: absolute;
    width: 6px;
    height: 6px;
    background: #e60023;
    border-radius: 50%;
    top: 10px;
    right: 10px;
    opacity: 0.8;
}

.saar-why-card:hover .saar-why-number {
    background: #1d1d1d;
    color: #fff;
    border-color: #1d1d1d;
    transform: translateY(-3px);
}


/* CONTENT */

.saar-why-content h3 {
    color: #1d1d1d;
    line-height: 1.35;
    margin-bottom: 14px;
}

.saar-why-content p {
    color: #666;
    line-height: 1.9;
    margin: 0;
}


/* SCROLL ANIMATION */

.reveal-fade,
.reveal-up {
    opacity: 0;
    transform: translateY(70px);
    transition: 1s ease;
}

.reveal-fade.active,
.reveal-up.active {
    opacity: 1;
    transform: translateY(0);
}

.reveal-up:nth-child(2) {
    transition-delay: 0.1s;
}

.reveal-up:nth-child(3) {
    transition-delay: 0.2s;
}

.reveal-up:nth-child(4) {
    transition-delay: 0.3s;
}

.reveal-up:nth-child(5) {
    transition-delay: 0.4s;
}

.reveal-up:nth-child(6) {
    transition-delay: 0.5s;
}

.reveal-up:nth-child(7) {
    transition-delay: 0.6s;
}


/* RESPONSIVE */

@media(max-width:1100px) {
    .saar-why-top {
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

@media(max-width:768px) {
    .saar-why-section {
        padding: 80px 18px;
    }
    .saar-why-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }
    .saar-why-card {
        padding: 28px 22px;
        border-radius: 22px;
        gap: 18px;
    }
    .saar-why-number {
        min-width: 48px;
        height: 48px;
        border-radius: 14px;
    }
    .saar-why-title {
        gap: 14px;
    }
    .saar-why-title span {
        width: 45px;
    }
}


/* new 2nd section for ads management start */


/* =========================================
   EXPERTISE SECTION STYLES
========================================= */

.saar-exp-section {
    padding: 60px 20px;
    color: #1d1d1d;
    overflow: hidden;
}

.saar-exp-container {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 70px;
    /* UPDATE: Change to stretch so both columns take the exact same height */
    align-items: stretch;
}


/* Image Column Styles */

.saar-exp-img-col {
    display: flex;
    flex-direction: column;
}

.saar-exp-img-wrapper {
    position: relative;
    border-radius: 8px;
    z-index: 1;
    /* UPDATE: Fills the entire height of the column */
    height: 100%;
    flex-grow: 1;
}

.saar-exp-img-wrapper img {
    width: 100%;
    /* UPDATE: Forces the image to take 100% height of its wrapper */
    height: 100%;
    /* UPDATE: Ensures the image covers the area without distorting */
    object-fit: cover;
    display: block;
    border-radius: 8px;
    box-shadow: 0 15px 35px rgba(29, 29, 29, 0.15);
    position: relative;
    z-index: 2;
    /* Default Black & White Filter */
    /*filter: grayscale(100%);*/
    transition: transform 0.4s ease, filter 0.4s ease;
}

/*.saar-exp-img-wrapper:hover img {*/
/*    transform: translateY(-5px);*/
    /* Color Reveal on Hover */
/*    filter: grayscale(0%);*/
/*}*/

.saar-exp-accent-top {
    position: absolute;
    top: -15px;
    left: -15px;
    width: 40%;
    height: 40%;
    border-top: 3px solid #e60023;
    border-left: 3px solid #e60023;
    border-radius: 8px 0 0 0;
    z-index: 0;
    opacity: 0.8;
}

.saar-exp-accent-bottom {
    position: absolute;
    bottom: -15px;
    right: -15px;
    width: 40%;
    height: 40%;
    border-bottom: 3px solid #e60023;
    border-right: 3px solid #e60023;
    border-radius: 0 0 8px 0;
    z-index: 0;
    opacity: 0.8;
}


/* Content Column Styles */

.saar-exp-content-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* Vertically centers the text content if the image is taller */
}

.saar-exp-content-col p {
    color: #1d1d1d;
    opacity: 0.85;
    line-height: 1.8;
    margin-top: 0;
    margin-bottom: 20px;
}

.saar-exp-content-col p:last-child {
    margin-bottom: 0;
}

.ad-campaign-copy p {
    color: #555555;
    font-weight: 400;
}


/* =========================================
   SCROLL REVEAL ANIMATIONS
========================================= */

.saar-reveal-left {
    opacity: 0;
    transform: translateX(-60px);
    transition: all 0.8s cubic-bezier(0.5, 0, 0, 1);
}

.saar-reveal-right {
    opacity: 0;
    transform: translateX(60px);
    transition: all 0.8s cubic-bezier(0.5, 0, 0, 1);
    transition-delay: 0.2s;
}

.saar-reveal-active {
    opacity: 1;
    transform: translate(0, 0);
}


/* =========================================
   MOBILE RESPONSIVENESS
========================================= */

@media (max-width: 992px) {
    .saar-exp-container {
        grid-template-columns: 1fr;
        gap: 50px;
    }
    .saar-exp-img-col {
        order: -1;
    }
    .saar-exp-img-wrapper {
        height: auto;
        flex-grow: 0;
    }
    .saar-exp-img-wrapper img {
        height: auto;
    }
    .saar-reveal-left,
    .saar-reveal-right {
        transform: translateY(40px);
    }
}


/* ------ */


/* Our Advertising/ PPC Services
 Layout & Grid Setup */

.v-scroll-ppc-wrapper {
    overflow: hidden;
}

.v-scroll-ppc-container {
    max-width: 1240px;
    margin: 0 auto;
}


/* Header & Accent Line */

.v-scroll-ppc-heading {
    color: #1d1d1d;
    font-weight: 700;
    margin: 0 0 16px 0;
    letter-spacing: -0.5px;
}


/* Cards Grid */

.v-scroll-ppc-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 48px 32px;
}


/* Minimalist Card Design */

.v-scroll-ppc-card {
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(29, 29, 29, 0.03);
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.6s ease;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(29, 29, 29, 0.04);
}

.v-scroll-ppc-card:hover {
    transform: translateY(-12px);
    box-shadow: 0 30px 60px rgba(29, 29, 29, 0.08);
}


/* Media Box & Sophisticated Image Filters */

.v-scroll-ppc-media-box {
    width: 100%;
    padding-top: 62%;
    position: relative;
    overflow: hidden;
    background-color: #1d1d1d;
}

.v-scroll-ppc-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* Classy dark, high-contrast monochrome base */
    /*filter: grayscale(100%) brightness(85%) contrast(110%);*/
    transition: filter 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}


/* Interactive Hover Filter States */

/*.v-scroll-ppc-card:hover .v-scroll-ppc-image {*/
/*    filter: grayscale(0%) brightness(100%) contrast(100%);*/
/*    transform: scale(1.06);*/
/*}*/


/* Content Configuration */

.v-scroll-ppc-content {
    padding: 36px 30px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.v-scroll-ppc-title {
    color: #1d1d1d;
    font-weight: 500;
    align-items: center;
    transition: color 0.3s ease;
}


/* .v-scroll-ppc-title::before {
    content: "";
    display: inline-block;
    width: 0px;
    height: 6px;
    background-color: #e60023;
    border-radius: 50%;
    margin-right: 0px;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
} */

.v-scroll-ppc-card:hover .v-scroll-ppc-title {
    color: #e60023;
}

.v-scroll-ppc-card:hover .v-scroll-ppc-title::before {
    width: 6px;
    margin-right: 10px;
}

.ads-management-page .v-scroll-ppc-content h3 {
    font-size: 24px !important;
    line-height: 1.3;
}

.v-scroll-ppc-text {
    color: #1d1d1d;
    opacity: 0.7;
    line-height: 1.65;
    margin: 0;
}


/* Advanced Mouse Scroll Reveal Keyframes */

@keyframes mouseScrollRevealUp {
    0% {
        opacity: 0;
        transform: translateY(80px) scale(0.96);
        filter: blur(4px);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: blur(0);
    }
}


/* Modern CSS Mouse Scroll-Driven Timelines (Direct interaction with mouse wheel tracking) */

@supports (animation-timeline: view()) {
    .v-scroll-ppc-card {
        animation: mouseScrollRevealUp both;
        animation-timeline: view();
        animation-range: entry 10% cover 30%;
    }
    .v-scroll-ppc-header-box {
        animation: mouseScrollRevealUp both;
        animation-timeline: view();
        animation-range: entry 5% cover 25%;
    }
}


/* High-performance Fallback Setup if native scroll timelines aren't enabled */

@supports not (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {
        .v-scroll-ppc-card {
            animation: mouseScrollRevealUp 1s cubic-bezier(0.16, 1, 0.3, 1) both;
        }
        .v-scroll-ppc-card:nth-child(1) {
            animation-delay: 0.1s;
        }
        .v-scroll-ppc-card:nth-child(2) {
            animation-delay: 0.2s;
        }
        .v-scroll-ppc-card:nth-child(3) {
            animation-delay: 0.3s;
        }
        .v-scroll-ppc-card:nth-child(4) {
            animation-delay: 0.4s;
        }
        .v-scroll-ppc-card:nth-child(5) {
            animation-delay: 0.5s;
        }
        .v-scroll-ppc-card:nth-child(6) {
            animation-delay: 0.6s;
        }
    }
}


/* Responsive Adaptive Viewports */

@media (max-width: 1024px) {
    .v-scroll-ppc-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px 24px;
    }
    .v-scroll-ppc-wrapper {
        padding: 90px 20px;
    }
}

@media (max-width: 640px) {
    .v-scroll-ppc-grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }
    .v-scroll-ppc-wrapper {
        padding: 30px 16px;
    }
    .v-scroll-ppc-content {
        padding: 28px 24px;
    }
    .v-scroll-ppc-image {
        filter: none !important;
    }
    .v-scroll-ppc-card {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
    }
}


/* ------------- */


/* --- Base Architecture --- */

.saar-premium-section {
    padding: 20px 30px;
    overflow: hidden;
    display: flex;
    justify-content: center;
}

.saar-premium-container {
    max-width: 1200px;
    width: 100%;
    gap: 4em;
    align-items: center;
}


/* --- Left Content Column --- */

.saar-content-wrapper {
    display: flex;
    flex-direction: column;
}

.saar-premium-heading {
    color: #1d1d1d;
    line-height: 1.2;
    margin-bottom: 0.5em;
    margin-top: 0;
}

.saar-premium-paragraph {
    color: #1d1d1d;
    line-height: 1.8;
    opacity: 0.85;
    margin: 0;
}


/* --- Right Features Column (Cascading Layout) --- */

.saar-features-wrapper {
    display: flex;
    flex-direction: column;
    gap: 1.2em;
}

.saar-feature-box {
    background: white;
    display: flex;
    align-items: center;
    padding: 1.2em 1.5em;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(29, 29, 29, 0.06);
    border: 1px solid rgba(29, 29, 29, 0.03);
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
}


/* Dynamic offset for a modern staggered look */

.saar-offset-card {
    margin-left: 8%;
}

.ads-management-page .saar-offset-card {
    margin-left: 0;
}


/* Red hover accent effect */

.saar-feature-box::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 4px;
    background-color: #e60023;
    transform: scaleY(0);
    transition: transform 0.4s ease;
    transform-origin: bottom;
}

.saar-feature-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(29, 29, 29, 0.1);
}

.saar-feature-box:hover::before {
    transform: scaleY(1);
}

.saar-icon-wrap {
    width: 28px;
    height: 28px;
    min-width: 28px;
    margin-right: 1.2em;
    display: flex;
    align-items: center;
    justify-content: center;
}

.saar-icon-wrap svg {
    width: 100%;
    height: 100%;
}

.saar-feature-label {
    color: #1d1d1d;
    font-weight: 600;
    line-height: 1.4;
}


/* --- Scroll Reveal Animations --- */

.saar-scroll-reveal {
    opacity: 0;
    will-change: transform, opacity;
}

.saar-fade-in {
    transform: translateX(-30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.saar-slide-up {
    transform: translateY(30px);
    transition: opacity 0.6s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.saar-is-revealed.saar-fade-in {
    opacity: 1;
    transform: translateX(0);
}

.saar-is-revealed.saar-slide-up {
    opacity: 1;
    transform: translateY(0);
}

.saar-delay-100 {
    transition-delay: 0.1s;
}

.saar-delay-200 {
    transition-delay: 0.2s;
}

.saar-delay-300 {
    transition-delay: 0.3s;
}

.saar-delay-400 {
    transition-delay: 0.4s;
}

.saar-delay-500 {
    transition-delay: 0.5s;
}


/* --- Mobile Responsiveness --- */

@media screen and (max-width: 992px) {
    .saar-premium-container {
        grid-template-columns: 1fr;
        gap: 3em;
    }
    .saar-offset-card {
        margin-left: 0;
        /* Remove stagger on mobile for clean stacking */
    }
}


/* basemnet section */


/* =========================================
   NXQ Premium Web Services Section
========================================= */

.nxq-premium-services {
    position: relative;
    padding: 40px 20px;
    overflow: hidden;
    z-index: 1;
}


/* Background Effects */

.nxq-premium-services::before {
    content: "";
    position: absolute;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    top: -250px;
    right: -250px;
    filter: blur(10px);
}

.nxq-premium-services::after {
    content: "";
    position: absolute;
    width: 320px;
    height: 320px;
    border: 1px solid rgba(29, 29, 29, 0.05);
    border-radius: 50%;
    bottom: -180px;
    left: -180px;
}


/* Heading */

.nxq-premium-heading {
    max-width: 1200px;
    margin: auto;
    text-align: center;
    position: relative;
    z-index: 2;
}

.nxq-premium-heading h2 {
    color: #1d1d1d;
    line-height: 1.3;
    margin-bottom: 20px;
}

.nxq-premium-heading p {
    color: rgba(29, 29, 29, 0.72);
    line-height: 1.9;
    margin: 0;
}


/* Grid */

.nxq-premium-grid {
    max-width: 1250px;
    margin: 75px auto 0;
    margin-top: 40px !important;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    position: relative;
    z-index: 2;
}


/* Card */

.nxq-service-card {
    position: relative;
    background: #ffffff;
    border: 1px solid rgba(29, 29, 29, 0.08);
    border-radius: 30px;
    padding: 42px 36px;
    overflow: hidden;
    transition: 0.45s cubic-bezier(.19, 1, .22, 1);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.03);
}

.nxq-service-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(230, 0, 35, 0.03), transparent 60%);
    opacity: 0;
    transition: 0.4s ease;
}

.nxq-service-card::after {
    content: "";
    position: absolute;
    top: 0;
    left: 36px;
    width: 0%;
    height: 2px;
    background: rgba(230, 0, 35, 0.65);
    transition: 0.5s ease;
}

.nxq-service-card:hover {
    transform: translateY(-14px);
    border-color: rgba(230, 0, 35, 0.12);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.08);
}

.nxq-service-card:hover::before {
    opacity: 1;
}

.nxq-service-card:hover::after {
    width: calc(100% - 72px);
}


/* Icon */

.nxq-service-icon {
    width: 70px;
    height: 70px;
    border-radius: 30px;
    background: rgba(230, 0, 35, 0.06);
    border: 1px solid rgba(230, 0, 35, 0.10);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    transition: 0.45s ease;
    position: relative;
    z-index: 2;
}

.nxq-service-icon i {
    color: #1d1d1d;
    font-size: 38px;
    transition: 0.4s ease;
}

.nxq-service-card:hover .nxq-service-icon {
    background: #1d1d1d;
    border-color: #1d1d1d;
    transform: translateY(-5px) rotate(-5deg);
}

.nxq-service-card:hover .nxq-service-icon i {
    color: #ffffff;
}


/* Content */

.nxq-service-content {
    position: relative;
    z-index: 2;
}

.nxq-service-content h3 {
    color: #1d1d1d;
    line-height: 1.4;
}

.nxq-service-content p {
    color: rgba(29, 29, 29, 0.72);
    line-height: 1.9;
    margin: 0;
}

.graphic-service-directory {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 56px;
    border-top: 1px solid rgba(29, 29, 29, 0.2);
}

.graphic-services-container {
    width: min(1320px, calc(100% - 40px));
    margin: 0 auto;
}

.graphic-service-row {
    display: grid;
    grid-template-columns: 32px 46px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    min-height: 190px;
    padding: 32px 28px 32px 0;
    border-bottom: 1px solid rgba(29, 29, 29, 0.2);
}

.graphic-service-row:not(:nth-child(3n + 1)) {
    padding-left: 28px;
    border-left: 1px solid rgba(29, 29, 29, 0.14);
}

.graphic-service-number {
    color: #e60023;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.12em;
    padding-top: 8px;
}

.graphic-service-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    color: #1d1d1d;
    border-left: 2px solid #e60023;
    font-size: 20px;
}

.graphic-service-row h4 {
    margin: 3px 0 12px;
    color: #1d1d1d;
    font-size: 23px;
    font-weight: 500;
    line-height: 1.25;
}

.graphic-service-row p {
    margin: 0;
    color: #666666;
    line-height: 1.7;
}

@media (max-width: 991.98px) {
    .graphic-service-directory {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .graphic-service-row,
    .graphic-service-row:not(:nth-child(3n + 1)) {
        padding: 28px 22px 28px 0;
        border-left: 0;
    }

    .graphic-service-row:nth-child(even) {
        padding-left: 22px;
        border-left: 1px solid rgba(29, 29, 29, 0.14);
    }
}

@media (max-width: 575.98px) {
    .graphic-service-directory {
        grid-template-columns: 1fr;
        margin-top: 36px;
    }

    .graphic-service-row,
    .graphic-service-row:not(:nth-child(3n + 1)),
    .graphic-service-row:nth-child(even) {
        grid-template-columns: 28px 40px minmax(0, 1fr);
        gap: 12px;
        min-height: 0;
        padding: 24px 0;
        border-left: 0;
    }

    .graphic-service-row h4 {
        font-size: 20px;
    }
}


/* =========================================
   Scroll Reveal Animation
========================================= */

.reveal-nxq {
    opacity: 0;
    transform: translateY(90px);
    transition: all 1s cubic-bezier(.19, 1, .22, 1);
}

.reveal-nxq.nxq-active {
    opacity: 1;
    transform: translateY(0);
}


/* =========================================
   Responsive
========================================= */

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

@media(max-width: 767px) {
    .nxq-premium-services {
        padding: 80px 15px;
    }
    .nxq-premium-grid {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-top: 50px;
    }
    .nxq-service-card {
        padding: 30px 24px;
        border-radius: 24px;
    }
    .nxq-service-icon {
        width: 82px;
        height: 82px;
        border-radius: 24px;
        margin-bottom: 24px;
    }
    .nxq-service-icon i {
        font-size: 30px;
    }
}


/* new section CSS STYLES */

.saar-light-choose-section {
    /* Changed from black to white */
    color: #1d1d1d;
    /* Text color is now the dark theme color */
    padding: 4rem 2rem;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

.saar-light-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
}

.saar-light-header {
    text-align: center;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.saar-light-title {
    margin: 0;
    font-weight: 700;
    line-height: 1.3;
    color: #1d1d1d;
}

.website-choose-title {
    font-size: 42px !important;
    line-height: 1.2 !important;
}

.website-choose-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 70px;
    margin-top: 32px;
    border-top: 1px solid rgba(29, 29, 29, 0.18);
}

.website-choose-item {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 20px;
    padding: 34px 0;
    border-bottom: 1px solid rgba(29, 29, 29, 0.18);
}

.website-choose-number {
    color: #e60023;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.12em;
    padding-top: 5px;
}

.website-choose-item h3 {
    margin: 0 0 12px;
    color: #1d1d1d;
    font-size: 24px;
    font-weight: 500;
    line-height: 1.3;
}

.website-choose-item p {
    margin: 0;
    color: #666666;
    line-height: 1.75;
}

@media (max-width: 767.98px) {
    .website-choose-title {
        font-size: 30px !important;
    }

    .website-choose-list {
        grid-template-columns: 1fr;
        column-gap: 0;
    }

    .website-choose-item {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 14px;
        padding: 26px 0;
        transition-delay: 0s !important;
    }

    .website-choose-item h3 {
        font-size: 21px;
    }
}

.saar-light-subtitle {
    margin: 0;
    line-height: 1.6;
    opacity: 0.8;
    color: #1d1d1d;
}

.saar-light-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 2rem;
}

.saar-light-card {
    background-color: #ffffff;
    border: 1px solid rgba(29, 29, 29, 0.08);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
    padding: 2.5rem 2rem;
    border-radius: 12px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
    overflow: hidden;
}

.saar-light-accent-line {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 4px;
    background-color: #e60023;
    /* Red accent */
    transition: width 0.4s ease;
}

.saar-light-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
    border-color: rgba(230, 0, 35, 0.2);
}

.saar-light-card:hover .saar-light-accent-line {
    width: 100%;
}

.saar-light-card-title {
    margin: 0;
    font-weight: 600;
    line-height: 1.4;
    color: #1d1d1d;
}

.saar-light-card-desc {
    margin: 0;
    line-height: 1.6;
    opacity: 0.75;
    color: #1d1d1d;
}


/* Scroll Reveal Animation Classes */

.saar-fade-up {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
}

.saar-fade-up.saar-in-view {
    opacity: 1;
    transform: translateY(0);
}


/* Mobile Responsiveness */

@media (max-width: 768px) {
    .saar-light-choose-section {
        padding: 4rem 1.5rem;
    }
    .saar-light-container {
        gap: 3rem;
    }
    .saar-light-grid {
        grid-template-columns: 1fr;
    }
    /* Disable transition delays on mobile to prevent staggering issues while scrolling */
    .saar-light-card.saar-fade-up {
        transition-delay: 0s !important;
    }
}

.graphic h4 {
    margin-bottom: 11px !important;
}

.animation .v-scroll-ppc-grid {
    grid-template-columns: repeat(2, 1fr);
}

.casestudy2 .v-scroll-ppc-image {
    object-fit: unset;
}

.casestudy2 .v-scroll-ppc-media-box {
    padding-top: 100% !important;
}


/* ── Process Horizontal: Mobile Responsive (≤900px) ── */

@media (max-width: 900px) {
    .process-section.process-horizontal {
        padding: 40px 0 30px;
    }
    .process-section.process-horizontal .process-head {
        opacity: 1 !important;
        transform: none !important;
        margin-bottom: 40px;
    }
    .process-section.process-horizontal .process-head h2 {
        font-size: clamp(1.4rem, 5vw, 1.85rem);
    }
    .process-section.process-horizontal .process-head p {
        font-size: .92rem;
    }
    .process-section.process-horizontal .process-curve-path,
    .process-section.process-horizontal .process-scroll-man,
    .process-section.process-horizontal .process-connector,
    .process-section.process-horizontal .process-dot,
    .process-section.process-horizontal .process-glow {
        display: none !important;
    }
    .process-section.process-horizontal .process-scroll-stage {
        min-height: 0 !important;
        height: auto !important;
        padding: 0 !important;
        display: block;
    }
    .process-section.process-horizontal .process-curve {
        min-height: 0 !important;
        padding: 0 !important;
    }
    .process-section.process-horizontal .process-anchor {
        opacity: 1 !important;
        transform: none !important;
        position: static !important;
        width: auto !important;
        height: auto !important;
        left: auto !important;
        top: auto !important;
        display: flex;
        justify-content: center;
        margin-bottom: 16px;
    }
    .process-section.process-horizontal .process-item {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        bottom: auto !important;
        width: 100% !important;
        max-width: 400px;
        min-height: 0;
        transform: none !important;
        margin: 0 auto !important;
        padding: 20px 20px 18px 54px;
        box-sizing: border-box;
    }
    .process-section.process-horizontal .process-anchor.is-path-below .process-item,
    .process-section.process-horizontal .process-anchor.is-path-above .process-item {
        top: auto !important;
        bottom: auto !important;
    }
    .process-section.process-horizontal .process-step {
        display: block;
    }
    .process-section.process-horizontal .process-step-badge {
        position: absolute;
        left: 16px;
        top: 18px;
        width: 30px;
        height: 30px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 10px;
        background: linear-gradient(135deg, #e60023, #ff3d5a);
        color: #fff;
        font-size: .78rem;
        font-weight: 800;
        box-shadow: 0 8px 18px rgba(230, 0, 35, .28);
    }
    .process-section.process-horizontal .process-item h3 {
        font-size: 1rem;
    }
}

section.hero-section.hero-1.bg-cover .container {
    margin-top: 35px;
}

.service-section > .container > .row.g-2 > [class*="col-"] {
    display: flex;
}

.service-section .service-block-one {
    width: 100%;
    height: 100%;
}

.service-section .services-heading-nowrap {
    color: inherit !important;
    white-space: nowrap;
}

.service-section .service-block-one .inner-block {
    width: 100%;
    height: 510px;
}

.service-section .service-block-one .content-box .text {
    text-align: left !important;
}

section.hero-section.hero-1.bg-cover {
    position: relative;
    z-index: 3;
    height: min(52.632vw, 1000px) !important;
    min-height: 0 !important;
    padding: 130px 0 70px !important;
    overflow: hidden !important;
    margin-bottom: -3px;
    border-bottom: 0 !important;
    outline: 0 !important;
    box-shadow: inset 0 -4px 0 #000 !important;
}

@media (min-width: 768px) and (max-width: 1399.98px) {
    section.hero-section.hero-1.bg-cover {
        height: 1000px !important;
        min-height: 1000px !important;
        padding-right: 40px !important;
        background-position: center top !important;
    }
}

.home > .about-section {
    position: relative;
    z-index: 2;
    margin-top: 0;
    padding: clamp(70px, 8vw, 120px) 0;
    border-top: 0;
    outline: 0;
    box-shadow: none;
    background: #f8f8f8 url("images/banner-background.png") center top / 100% 100% no-repeat;
}

.home > .about-section::before {
    content: none !important;
    display: none !important;
}

.home > .about-section .sec-title .title,
.home > .about-section .sec-title .title .char,
.home > .about-section .sec-title .title span {
    color: #fff !important;
}

.home > .about-section .about-intro-white,
.home > .about-section .about-intro-white b,
.home > .about-section .about-points-white li {
    color: #fff !important;
}

.home > .about-section .agency-min-image-wrap .fx-tilt-target {
    border-radius: 28px !important;
    overflow: hidden;
}

.home > .about-section .agency-min-image-wrap img {
    display: block;
    width: 100%;
    border-radius: 28px !important;
}

@media screen and (max-width: 767px) {
    .home > .about-section .about-points-white li {
        color: #252525 !important;
    }

    .service-section .service-block-one .inner-block {
        height: auto;
        min-height: 0;
    }

    section.hero-section.hero-1.bg-cover {
        height: auto !important;
        min-height: 520px !important;
        padding: 108px 0 50px !important;
    }

    .home > .about-section {
        padding: 55px 0;
        background-size: auto 100%;
    }

    .home > .about-section .sec-title .title,
    .home > .about-section .sec-title .title .char,
    .home > .about-section .sec-title .title span {
        color: #ffffff !important;
    }

    .home > .about-section .about-intro-white,
    .home > .about-section .about-intro-white b {
        color: #ffffff !important;
        text-shadow: none !important;
    }

    .home > .about-section .about-points-white li {
        color: #1d1d1d !important;
        text-shadow: none !important;
    }

    .about-content .about-thumb-items {
        margin-bottom: 0px;
    }
}


/* Home about image: smoother editorial shape */

.about-section .about-image-1 {
    width: min(100%, 560px);
    height: 720px;
    border-radius: 0;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 560 720'%3E%3Cpath d='M88 0H194C227 0 254 26 254 59V62C254 76 266 88 280 88C294 88 306 76 306 62V59C306 26 333 0 366 0H472C521 0 560 39 560 88V632C560 681 521 720 472 720H356C321 720 292 693 290 658C289 643 271 637 261 649L231 687C214 708 189 720 162 720H88C39 720 0 681 0 632V88C0 39 39 0 88 0Z' fill='black'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 560 720'%3E%3Cpath d='M88 0H194C227 0 254 26 254 59V62C254 76 266 88 280 88C294 88 306 76 306 62V59C306 26 333 0 366 0H472C521 0 560 39 560 88V632C560 681 521 720 472 720H356C321 720 292 693 290 658C289 643 271 637 261 649L231 687C214 708 189 720 162 720H88C39 720 0 681 0 632V88C0 39 39 0 88 0Z' fill='black'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
    filter: drop-shadow(0 28px 42px rgba(0, 0, 0, 0.12));
}

.about-section .about-image-1 img {
    border-radius: 0;
    object-position: center;
}

@media (max-width: 1199.98px) {
    .about-section .about-image-1 {
        height: 560px;
        -webkit-mask-size: 100% 100%;
        mask-size: 100% 100%;
    }
}

@media (max-width: 575.98px) {
    .about-section .about-image-1 {
        height: 420px;
    }
}

.myflex {
    display: flex;
    flex-direction: column;
}


/* Site-wide mobile responsiveness pass */

@media (max-width: 1199.98px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }
    .page-wrapper,
    #smooth-wrapper,
    #smooth-content {
        max-width: 100%;
        overflow-x: clip;
    }
    .container,
    .container-fluid {
        max-width: 100%;
    }
    img,
    video,
    iframe,
    canvas,
    svg {
        max-width: 100%;
    }
    .row>[class*="col-"] {
        min-width: 0;
    }
}

@media (max-width: 991.98px) {
    .section-padding,
    .saar-why-section,
    .saar-exp-section,
    .saar-premium-section,
    .nxq-premium-services,
    .seo-results-section,
    .seo-need-section,
    .seo-tools-section,
    .seo-activities-section,
    .seo-process-section,
    .seo-case-section,
    .seo-svc-rail-section,
    .seo-choose-section,
    .seo-industries-section,
    .seo-rank-section,
    .smm-approach-section,
    .smm-cta-section,
    .modern-cta-section,
    .about-2-section,
    .minimal-counter-section,
    .project-section,
    .service-section,
    .faq-section,
    .news-section-3,
    .video-parallax-section {
        padding-top: 70px !important;
        padding-bottom: 70px !important;
    }
    .pt-120,
    .pt-90 {
        padding-top: 70px !important;
    }
    .pb-120,
    .pb-80 {
        padding-bottom: 70px !important;
    }
    .page-title {
        min-height: 320px !important;
        padding: 115px 0 68px !important;
        background-position: center !important;
    }
    .page-title .title {
        font-size: clamp(2rem, 9vw, 2.75rem) !important;
        line-height: 1.1 !important;
        overflow-wrap: anywhere;
    }
    .page-breadcrumb {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        row-gap: 6px;
    }
    .sec-title,
    .seo-results-head,
    .seo-need-head,
    .seo-tools-copy,
    .seo-activities-head,
    .seo-process-head,
    .seo-case-head,
    .seo-svc-rail-head,
    .seo-choose-head,
    .seo-rank-head,
    .nxq-premium-heading,
    .saar-premium-heading,
    .saar-why-top,
    .v-scroll-ppc-heading {
        margin-bottom: 32px !important;
    }
    .sec-title .title,
    .seo-results-head h2,
    .seo-need-head h2,
    .seo-tools-copy .title,
    .seo-activities-head h2,
    .seo-process-head h2,
    .seo-case-head h2,
    .seo-svc-rail-title,
    .seo-choose-title,
    .seo-rank-head h2,
    .nxq-premium-heading h2,
    .saar-premium-heading h2,
    .saar-why-title h2,
    .agency-min-content h2,
    .about-2-title,
    .modern-cta-wrapper h2,
    .smm-cta-content h2,
    .v-scroll-ppc-heading h2 {
        font-size: clamp(1.65rem, 7vw, 2.15rem) !important;
        line-height: 1.18 !important;
        letter-spacing: 0 !important;
        overflow-wrap: anywhere;
    }
    .agency-min-grid,
    .saar-exp-container,
    .saar-why-grid,
    .saar-premium-container,
    .nxq-premium-grid,
    .v-scroll-ppc-grid,
    .seo-results-grid,
    .seo-need-grid,
    .seo-activities-grid,
    .seo-process-flow,
    .seo-case-grid,
    .seo-rank-grid,
    .seo-svc-rail-track,
    .seo-choose-grid,
    .smm-approach-grid,
    .travelit-dest-grid,
    .counter-boxed-grid,
    .saar-light-grid {
        grid-template-columns: 1fr !important;
    }
    .agency-min-grid,
    .saar-exp-container,
    .saar-why-grid,
    .saar-premium-container,
    .nxq-premium-grid,
    .v-scroll-ppc-grid,
    .seo-results-grid,
    .seo-need-grid,
    .seo-activities-grid,
    .seo-process-flow,
    .seo-case-grid,
    .seo-rank-grid,
    .seo-svc-rail-track,
    .seo-choose-grid,
    .smm-approach-grid,
    .travelit-dest-grid,
    .counter-boxed-grid {
        gap: 22px !important;
    }
    .seo-choice-card--wide {
        grid-column: auto !important;
    }
    .seo-choose-body {
        flex-direction: column !important;
        gap: 24px !important;
    }
    .seo-choose-body>[class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
    .seo-choose-visual,
    .seo-orbit-wrap,
    .seo-orbit {
        min-height: 0 !important;
        height: auto !important;
    }
    .seo-orbit {
        aspect-ratio: 1 / 1;
        max-width: 320px;
        margin: 0 auto;
    }
    .saar-exp-img-col,
    .saar-exp-content-col,
    .agency-min-image-wrap,
    .agency-min-content {
        width: 100%;
        max-width: 100%;
    }
    .agency-min-image-wrap,
    .saar-exp-img-col {
        margin-left: auto;
        margin-right: auto;
    }
    .agency-min-image img,
    .saar-exp-img-wrapper img,
    .minimal-main-image,
    .about-2-card img {
        width: 100%;
        height: auto;
        object-fit: cover;
    }
    .service-block-one .inner-block,
    .seo-result-card,
    .seo-need-card,
    .seo-tool-card,
    .seo-activity-card,
    .seo-process-step,
    .seo-case-card,
    .seo-rank-card,
    .seo-svc-card,
    .seo-choice-card,
    .smm-service-card,
    .smm-approach-card,
    .saar-why-card,
    .v-scroll-ppc-card,
    .nxq-service-card,
    .saar-light-card,
    .portfolio-card {
        min-width: 0 !important;
        max-width: 100% !important;
    }
    .service-block-one .inner-block .content-box {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .choose-us-image-1 {
        max-width: 560px;
        margin: 36px auto 0;
    }
    .choose-us-image-1 img {
        height: auto !important;
        object-fit: cover;
    }
    .contact-form-style-1,
    .contact-form-block,
    .seo-audit-card-inner,
    .smm-cta-box {
        border-radius: 22px !important;
    }
    .contact-form-style-1 .contact-form-box,
    .contact-form-block,
    .seo-audit-card-inner {
        padding: 28px 20px !important;
    }
    input,
    textarea,
    select,
    button {
        max-width: 100%;
    }
    .contact-details__info li {
        align-items: flex-start;
    }
    .contact-details__info li .text,
    .contact-details__info li .text a,
    .contact-details__info li .text span {
        min-width: 0;
        overflow-wrap: anywhere;
    }
    .map-section iframe {
        min-height: 320px;
    }
}

@media (max-width: 767.98px) {
    body {
        font-size: 15px;
    }
    .container,
    .container-fluid {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    .row {
        --bs-gutter-x: 1.25rem;
        --bs-gutter-y: 1.5rem;
    }
    p,
    li,
    a,
    span,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        overflow-wrap: break-word;
    }
    .section-padding,
    .saar-why-section,
    .saar-exp-section,
    .saar-premium-section,
    .nxq-premium-services,
    .seo-results-section,
    .seo-need-section,
    .seo-tools-section,
    .seo-activities-section,
    .seo-process-section,
    .seo-case-section,
    .seo-svc-rail-section,
    .seo-choose-section,
    .seo-industries-section,
    .seo-rank-section,
    .smm-approach-section,
    .smm-cta-section,
    .modern-cta-section,
    .about-2-section,
    .minimal-counter-section,
    .project-section,
    .service-section,
    .faq-section,
    .news-section-3,
    .video-parallax-section {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }
    .pt-120,
    .pt-90 {
        padding-top: 0px !important;
    }
    .pb-120,
    .pb-80 {
        padding-bottom: 54px !important;
    }
    .mobiletopspace {
        padding-top: 54px !important;
    }
    .page-title {
        min-height: 280px !important;
        padding: 104px 0 54px !important;
    }
    .page-title .title {
        font-size: clamp(1.85rem, 10vw, 2.35rem) !important;
    }
    .sec-title {
        margin-bottom: 28px !important;
    }
    .sub-title,
    .seo-svc-rail-eyebrow,
    .seo-choose-eyebrow,
    .smm-cta-badge {
        white-space: normal !important;
    }
    .hero-btn-wrapper,
    .seo-hero-actions {
        align-items: center !important;
    }
    .hero-btn-wrapper .contact-btn,
    .seo-hero-cta,
    .contact-button .theme-btn,
    .mynewbutton {
        width: auto !important;
        min-width: 168px;
        max-width: min(260px, 100%);
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
    }
    .seo-audit-submit {
        width: 100%;
        max-width: 320px;
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
    }
    .portfolio-slider {
        padding: 16px 0 42px;
    }
    .portfolio-card,
    .portfolio-image,
    .seo-tool-card,
    .seo-result-card,
    .v-scroll-ppc-card,
    .travelit-dest-card,
    .agency-min-image,
    .agency-min-image img,
    .saar-exp-img-wrapper,
    .saar-exp-img-wrapper img {
        border-radius: 20px !important;
    }
    .seo-tools-carousel-wrap,
    .partners-marquee-section,
    .portfolio-carousel-section {
        overflow: hidden;
    }
    .seo-tool-card {
        height: auto !important;
        aspect-ratio: 1 / 1;
    }
    .seo-tool-card img {
        height: 100%;
        object-fit: cover;
    }
    .v-scroll-ppc-media-box {
        padding-top: 72% !important;
    }
    .casestudy2 .v-scroll-ppc-media-box {
        padding-top: 86% !important;
    }
    .animation .v-scroll-ppc-grid {
        grid-template-columns: 1fr !important;
    }
    .video-image,
    .video-parallax-section {
        min-height: 360px !important;
    }
    .video-image img {
        min-height: 360px;
        object-fit: cover;
    }
    .brand-shine-card {
        width: 70px !important;
    }
    .minimal-counter-section {
        min-height: 0 !important;
    }
    .counter-boxed-grid {
        max-width: 420px;
        margin-left: auto;
        margin-right: auto;
    }
    .choose-us-content-1 .feature-box-wrapper {
        grid-template-columns: 1fr !important;
    }
    .choose-us-content-1 .choose-client-info {
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
    }
    .choose-us-image-1 .choose-counter {
        position: static !important;
        width: 100% !important;
        height: auto !important;
        margin-top: 16px;
        border-radius: 18px;
        padding: 18px;
    }
    .faq-content .accordion-box .block .acc-btn {
        padding-right: 48px !important;
        font-size: 1rem !important;
        line-height: 1.45 !important;
    }
    .accordion-box .block .acc-content .content {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }
    .contact-details__info {
        grid-template-columns: 1fr !important;
    }
    .contact-details__info li {
        padding: 20px !important;
    }
    .contact-details__right .contact-details__info li {
        display: grid !important;
        padding: 18px 0 !important;
    }
    .contact-form-style-1 {
        padding: 0 !important;
    }
    .contact-form-style-1 .contact-form-box {
        padding: 24px 18px !important;
    }
    .contact-form-style-1 .contact-form-box .form-clt input,
    .contact-form-style-1 .contact-form-box .form-clt textarea,
    .seo-audit-field input {
        min-height: 56px !important;
        font-size: 0.95rem !important;
    }
    .seo-audit-card {
        max-width: 100%;
    }
    .seo-audit-card-inner {
        padding: 24px 18px !important;
    }
    .seo-hero-stats {
        display: grid;
        grid-template-columns: 1fr;
    }
    .seo-orbit {
        max-width: 280px;
    }
    .seo-orbit-node-inner em {
        font-size: 0.68rem !important;
    }
    .smm-cta-box {
        padding: 48px 20px !important;
        border-radius: 22px !important;
    }
    .news-section-3 .row,
    .blog-section .row {
        row-gap: 24px;
    }
    .main-footer,
    .footer-section {
        overflow-x: hidden;
    }
}

@media (max-width: 420px) {
    .container,
    .container-fluid {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }
    .sec-title .title,
    .seo-results-head h2,
    .seo-need-head h2,
    .seo-tools-copy .title,
    .seo-activities-head h2,
    .seo-process-head h2,
    .seo-case-head h2,
    .seo-svc-rail-title,
    .seo-choose-title,
    .seo-rank-head h2,
    .nxq-premium-heading h2,
    .saar-premium-heading h2,
    .saar-why-title h2,
    .agency-min-content h2,
    .about-2-title,
    .modern-cta-wrapper h2,
    .smm-cta-content h2,
    .v-scroll-ppc-heading h2 {
        font-size: clamp(1.45rem, 8vw, 1.9rem) !important;
    }
    .service-block-one .inner-block,
    .seo-result-card,
    .seo-need-card,
    .seo-tool-card,
    .seo-activity-card,
    .seo-case-card,
    .seo-rank-card,
    .seo-svc-card,
    .seo-choice-card,
    .smm-service-card,
    .smm-approach-card,
    .saar-why-card,
    .v-scroll-ppc-card,
    .nxq-service-card,
    .saar-light-card {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }
    .seo-process-step {
        padding-left: 70px !important;
    }
}

.contact-text.wow.fadeInUp {
    color: #fff;
}
@media (max-width: 575.98px) {
    .footer-logo-row {
     padding-bottom: 20px !important;
     padding-top: 20px !important;
    }
}

@media screen and (min-width: 1025px) {
    .myflex-row {
        display: flex !important;
        gap: 50px;
    }
}

@media (max-width: 420px) {
    article.saar-why-card {
        display: flex;
        flex-direction: column;
    }
}

@media (max-width: 767px) {
    .brand-shine-title {
        font-size: clamp(1.3rem, 6.5vw, 2rem) !important;
        line-height: 1.1 !important;
    }
    .brand-shine-content {
        padding: 30px 16px 20px !important;
        gap: 10px !important;
    }
    .brand-shine-section {
        padding: 0 !important;
    }
    .brand-shine-stage {
        min-height: 0 !important;
        height: 62vh !important;
        min-height: 430px !important;
        overflow: hidden !important;
    }
    .brand-shine-laptop {
        width: min(72vw, 360px) !important;
    }
    .brand-shine-laptop-screen {
        height: min(50vw, 240px) !important;
    }
}

@media screen and (max-width: 767px) {
    section.service-section.section-padding.bg-cover {
        margin-top: -150px;
    }
    section.brand-shine-section {
        margin-top: -120px;
    }
}

.ind-tabs-scroll-wrap {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}

.ind-tabs-scroll-wrap .ind-tabs-sidebar {
    flex: 1 1 auto;
    min-width: 0;
}

.ind-tabs-scroll-btn {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    background: #fff;
    font-size: 1.4rem;
    line-height: 1;
    color: #444;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    z-index: 2;
}

.ind-tabs-scroll-btn:hover {
    background: #262626;
    color: #fff;
    border-color: #262626;
}

.ind-tabs-scroll-btn:active {
    transform: scale(0.92);
}

@media (max-width: 767.98px) {
    .ind-tabs-scroll-btn {
        display: none !important;
    }
}

.cursive {
    text-align: center !important;
}

.about-2-text+.cursive {
    font-family: 'Georgia', 'Times New Roman', serif;
    font-style: italic;
    font-weight: 600;
    font-size: 1.25rem;
    color: #262626;
    letter-spacing: 0.02em;
    margin-top: 1rem;
}

.about-2-text+.cursive span {
    color: #e60023;
    font-size: 1.4rem;
    font-weight: 700;
}

@media screen and (max-width: 767px) {
    .content.wow.fadeInUp.mobdel {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    .col-lg-7.aboutboxes {
        margin-top: -60px;
    }
}

@media screen and (min-width: 1025px) {
    .marquee-area2.pb-0.mt-5 {
        margin-top: 7rem !important;
    }
    .process-section.process-horizontal {
        padding: 120px 0 20px !important;
    }
    h3.title.char-animation.fs-5 {
        font-size: 3.25rem !important;
    }
    .myfootersaar {
        display: flex;
    }
    h2.title.tx-title.sec_title.tz-itm-title.tz-itm-anim.fs-5 {
        font-size: 3.25rem !important;
    }
    ul.contact-info-list {
        display: flex;
        gap: 160px !important;
    }
    p {
        text-align: justify !important;
    }
    .contact-page .vec-shape {
        right: 0px !important;
    }
    .nxq-floating-wrap {
        left: 20px;
    }
}

@media screen and (max-width: 767px) {
    section.hero-section.hero-1.bg-cover {
        background-image: none !important;
        background: #000000 !important;
        background-color: #000000 !important;
    }

    section.hero-section.hero-1.bg-cover > .container {
        padding-left: 24px !important;
        padding-right: 76px !important;
    }

    section.hero-section.hero-1.bg-cover .hero-content-left {
        width: 100% !important;
        max-width: 300px !important;
        margin: 0 !important;
        text-align: left !important;
    }

    section.hero-section.hero-1.bg-cover .hero-content-left .content-items,
    section.hero-section.hero-1.bg-cover .hero-content-left .content {
        width: 100% !important;
        align-items: flex-start !important;
        top: 0 !important;
        text-align: left !important;
    }

    section.hero-section.hero-1.bg-cover .hero-left-heading {
        width: 100%;
        margin: 0 0 30px !important;
        font-size: clamp(2rem, 9vw, 2.55rem) !important;
        line-height: 1.08 !important;
        letter-spacing: -0.035em;
        text-align: left !important;
    }

    section.hero-section.hero-1.bg-cover .saar-glass-cta-wrap {
        width: 100%;
        margin-top: 0 !important;
        justify-content: flex-start !important;
    }

    .home section.testi-section.pt-5 {
        padding-top: 15rem !important;
    }
    section.testi-section.pt-5 .sec-title {
        margin-bottom: 28px !important;
    }
    p.counter-title.text-center.fs-5 {
        font-size: 14px !important;
        width: 133px;
    }
    .portfolio-carousel-section {
        padding: 20px 0px !important;
    }
    section#saarWhySection .sec-title.mb-0.text-center.pb-4 {
        margin-bottom: 0px !important;
    }
    .ind-tabs-container.horizontal-tb .ind-tab-btn {
        width: 335px !important;
    }
    section.smm-services-section.mt-5 {
        margin-top: 0px !important;
    }
    section.why-social-section.mt-4 {
        padding: 30px 18px;
    }
    section.why-social-section.mt-5 {
        margin-top: 0px;
    }
    section.seo-results-section .sec-title.mb-0.text-center {
        margin-bottom: 0px !important;
        margin-top: 30px !important;
    }
    .saar-light-container .sec-title.mb-0.text-center.pb-3 {
        margin-bottom: 0px !important;
    }
    .vec-shape.d-none.d-xl-block .container .row .col-lg-6 {
        padding-right: 0px !important;
        padding-left: 0px.contact-section !important;
    }
}

iframe {
    border-radius: 20px;
}


/* responsive video embed */

.agency-min-text .elementor-video {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1300 / 720;
}

@media (max-width: 768px) {
    .agency-min-text .elementor-video {
        aspect-ratio: 16 / 9;
    }
}


/* ── Mobile global overrides ── */

@media (max-width: 767px) {
    p:not(.text-center),
    .p:not(.text-center),
    .content text,
    .nxq-service-content p .tx-subTitle:not(.text-center) {
        text-align: left !important;
    }
    h2,
    .section-title,
    .sub-title,
    .sec-title {
        text-align: center !important;
    }
    img,
    picture,
    [class*="img-"] img,
    [class*="image"] img,
    [class*="media"] img,
    [class*="thumbnail"] img {
        filter: grayscale(0%) !important;
    }
    .title-outer.text-center {
        text-align: center !important;
    }
    .smhead {
        font-size: 12px;
    }
    .saar-premium-paragraph {
        margin-top: 20px !important;
    }
}

.myflextwo {
    display: flex;
}

.home .contact-section .mynewbutton::before {
    color: #fff !important;
}

@media (min-width: 1200px) {
    .home > .contact-section {
        width: calc(100% - 48px);
        max-width: 1320px;
        margin-right: auto !important;
        margin-left: auto !important;
    }

    .home > .contact-section > .container {
        max-width: 100%;
        padding-right: 36px;
        padding-left: 36px;
    }

    .home > .contact-section .contact-content-1 {
        padding-right: 34px;
    }

    .home > .contact-section .contact-content-1 .sec-title,
    .home > .contact-section .contact-content-1 .contact-text {
        text-align: left !important;
    }

    .home > .contact-section .contact-content-1 .title {
        max-width: 560px;
        margin-top: 18px;
        font-size: clamp(34px, 2.7vw, 46px);
        line-height: 1.15;
    }

    .home > .contact-section .contact-content-1 .contact-text {
        max-width: 520px;
        margin-top: 22px;
        line-height: 1.7;
    }

    .home > .contact-section .contact-content-1 .contact-list-items {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
        align-items: start;
        gap: 28px;
        margin-top: 72px;
    }

    .home > .contact-section .contact-content-1 .contact-list {
        min-width: 0;
    }

    .home > .contact-section .contact-content-1 .contact-list .title {
        margin-top: 0;
        font-size: 18px;
        line-height: 1.3;
    }

    .home > .contact-section .contact-content-1 .contact-icon {
        align-items: flex-start;
        gap: 14px;
    }

    .home > .contact-section .contact-content-1 .contact-icon p {
        max-width: none;
        margin: 0;
    }

    .home > .contact-section .contact-content-1 .contact-list-items .line {
        align-self: stretch;
        height: auto;
        min-height: 72px;
    }

    .home > .contact-section .contact-form-style-1 {
        margin-left: 30px;
    }
}

   .counter-minimal-item {
                        padding: 20px;
                        transition: all 0.4s ease;
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        align-items: center;
                    }
                    .counter-minimal-item:hover {
                        transform: translateY(-8px);
                    }
                    .counter-minimal-item .counter-icon {
                        width: 70px;
                        height: 70px;
                        margin-bottom: 20px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        border-radius: 50%;
                        background: transparent;
                        color: #ff4d6d;
                        font-size: 1.2rem;
                        position: relative;
                        z-index: 1;
                        transition: all 0.4s ease;
                    }
                    .counter-minimal-item .counter-icon::before {
                        content: '';
                        position: absolute;
                        top: 0; left: 0; right: 0; bottom: 0;
                        border-radius: 50%;
                        background: rgba(255, 77, 109, 0.1);
                        z-index: -1;
                        transform: scale(1);
                        transition: all 0.4s ease;
                    }
                    .counter-minimal-item:hover .counter-icon::before {
                        transform: scale(1.2);
                        background: rgba(255, 77, 109, 0.2);
                    }
                    .counter-minimal-item .counter-number-wrapper {
                        display: flex;
                        align-items: baseline;
                        margin-bottom: 5px;
                    }
                    .counter-minimal-item .counter-number {
                        font-size: 4rem;
                        line-height: 1;
                        color: #ffffff;
                        letter-spacing: -1px;
                        margin: 0;
                    }
                    .counter-minimal-item .counter-suffix {
                        font-size: 2.5rem;
                        font-weight: 600;
                        margin-left: 2px;
                    }
                    .counter-minimal-item .counter-title {
                        font-size: 0.95rem;
                        font-weight: 500;
                        letter-spacing: 2px;
                        color: #888888;
                        text-transform: uppercase;
                        margin-bottom: 0;
                        margin-top: 10px;
                        transition: color 0.3s ease;
                    }
                    .counter-minimal-item:hover .counter-title {
                        color: #ffffff;
                    }
                    /* Subtle separator line between items on desktop */
                    @media (min-width: 992px) {
                        .counter-col-with-divider {
                            position: relative;
                        }
                        .counter-col-with-divider:not(:last-child)::after {
                            content: '';
                            position: absolute;
                            top: 20%;
                            right: 0;
                            height: 60%;
                            width: 1px;
                            background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.1), transparent);
                        }
                    }

/* Global heading typeface */
h1,
h2,
h3,
h4,
h5 {
    font-family: Helvetica, Arial, sans-serif !important;
}

/* =========================================
   INTERACTIVE SERVICES PANEL STYLES
   ========================================= */

.modern-services-section {
    padding: 60px 0;
    background-color: #f6f6f6;
    position: relative;
    overflow: hidden;
}

.services-interactive-wrapper {
    margin-top: 50px;
    position: relative;
}

/* Nav Menu Styles (Left Column) */
.services-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.services-nav-item {
    display: flex;
    align-items: center;
    padding: 24px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.services-nav-item:last-child {
    border-bottom: none;
}

.service-nav-num {
    font-family: 'Courier New', Courier, monospace;
    font-size: 1.25rem;
    font-weight: 700;
    color: rgba(0, 0, 0, 0.15);
    margin-right: 25px;
    transition: color 0.3s ease;
}

.service-nav-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: #262626;
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.services-nav-item:hover .service-nav-title,
.services-nav-item.active .service-nav-title {
    transform: translateX(10px);
}

.services-nav-item:hover .service-nav-num,
.services-nav-item.active .service-nav-num {
    color: #e60023;
}

/* Showcase Area Styles (Right Column) */
.services-showcase-panel {
    position: relative;
    min-height: 480px;
    padding-left: 50px;
}

.service-panel-content {
    position: relative;
    display: none;
    opacity: 0;
}

.service-panel-content.active {
    display: block;
    opacity: 1;
}

.panel-image-wrap {
    position: relative;
    width: 100%;
    height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
}

.panel-image-bg {
    position: absolute;
    width: 160px;
    height: 160px;
    border-radius: 40% 60% 70% 30% / 40% 50% 60% 55%;
    background: linear-gradient(135deg, rgba(230, 0, 35, 0.06), rgba(230, 0, 35, 0.02));
    animation: blob-bounce 8s infinite ease-in-out;
}

.panel-img {
    position: relative;
    height: 100%;
    max-height: 240px;
    border-radius: 15px;
    object-fit: contain;
    filter: drop-shadow(0 15px 25px rgba(0, 0, 0, 0.06));
    animation: float 6s infinite ease-in-out;
    z-index: 2;
}

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

.panel-title {
    font-size: 2rem;
    font-weight: 700;
    color: #1d1d1d;
    margin-bottom: 18px;
    letter-spacing: -0.5px;
}

.panel-desc {
    font-size: 1.05rem;
    line-height: 1.8;
    color: #555555;
    margin-bottom: 30px;
}

.panel-link {
    display: inline-flex;
    align-items: center;
    font-size: 0.95rem;
    font-weight: 600;
    color: #1d1d1d;
    text-decoration: none;
    transition: color 0.3s ease;
}

.panel-link span {
    margin-right: 8px;
    position: relative;
}

.panel-link span::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 1.5px;
    background-color: #e60023;
    transition: width 0.3s ease;
}

.panel-link svg {
    width: 16px;
    height: 16px;
    fill: #1d1d1d;
    transition: transform 0.3s ease, fill 0.3s ease;
}

.panel-link:hover {
    color: #e60023;
}

.panel-link:hover span::after {
    width: 100%;
}

.panel-link:hover svg {
    fill: #e60023;
    transform: translateX(6px);
}

/* Responsive Styles */
@media (max-width: 991px) {
    .modern-services-section {
        padding: 50px 0;
    }
    .services-interactive-wrapper {
        margin-top: 30px;
    }
    .services-nav-list {
        display: none !important;
    }
    .services-showcase-panel {
        padding-left: 0;
        min-height: auto;
    }
    .service-panel-content {
        display: block !important;
        opacity: 1 !important;
        transform: none !important;
        margin-bottom: 40px;
        padding-bottom: 30px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    }
    .service-panel-content:last-child {
        margin-bottom: 0;
        padding-bottom: 0;
        border-bottom: none;
    }
    .panel-image-wrap {
        height: auto;
        margin-bottom: 20px;
    }
    .panel-image-bg {
        display: none !important; /* Hide background shape to avoid rectangular overlap */
    }
    .panel-img {
        max-height: 150px;
        border-radius: 12px; /* Smooth rounded corners for the banners */
    }
    .panel-title {
        font-size: 1.5rem;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .panel-desc {
        font-size: 0.95rem;
        line-height: 1.65;
        margin-bottom: 15px;
    }
}

/* Keep heading typography consistent across the entire website. */
html body h1,
html body h2,
html body h3,
html body h4,
html body h5 {
    font-family: Helvetica, Arial, sans-serif !important;
}

@media (max-width: 575.98px) {
    #minimal-counter-section .row {
        display: flex !important;
        flex-wrap: wrap !important;
        margin-right: -6px;
        margin-left: -6px;
    }

    #minimal-counter-section .counter-col-with-divider {
        flex: 0 0 50% !important;
        width: 50% !important;
        max-width: 50% !important;
        padding-right: 6px;
        padding-left: 6px;
    }

    #minimal-counter-section .counter-minimal-item {
        min-height: 210px;
        padding: 16px 4px !important;
        justify-content: center;
    }

    #minimal-counter-section .counter-minimal-item .counter-icon {
        width: 54px;
        height: 54px;
        margin-bottom: 14px;
        font-size: 1rem;
    }

    #minimal-counter-section .counter-minimal-item .counter-number {
        font-size: 2.8rem;
    }

    #minimal-counter-section .counter-minimal-item .counter-suffix {
        font-size: 1.7rem;
    }

    #minimal-counter-section .counter-minimal-item .counter-title {
        max-width: 145px;
        font-size: 0.7rem;
        line-height: 1.45;
        letter-spacing: 1px;
        text-align: center;
    }
}
  .single-article {
            padding: 60px 0 110px;
            background: #f6f6f6;
        }

        .single-blog-page .main-header.fixed-header > .container {
            opacity: 0 !important;
            visibility: hidden !important;
            pointer-events: none !important;
        }

        .single-blog-page .main-header .sticky-header.fixed-header {
            opacity: 1 !important;
            visibility: visible !important;
            z-index: 100001 !important;
        }

        .single-article__inner {
            width: 100%;
            max-width: 1200px;
            margin: 0 auto;
        }

        .single-article__image {
            width: 100%;
            aspect-ratio: 1200 / 640;
            margin-bottom: 42px;
            overflow: hidden;
            background: #e7e7e7;
            border-radius: 20px;
            box-shadow: 0 16px 45px rgba(0, 0, 0, .08);
        }

        .single-article__image img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .single-article__content {
         
            margin: 0 auto;
        }

        .single-article__content.blog-content-images img {
            display: block;
            width: 400px;
            height: 300px;
            max-width: 100%;
            object-fit: cover;
            object-position: center;
            margin: 10px 0;
        }

        .single-article__content h2 {
            margin: 0 0 20px;
            color: #111;
            padding-top: 20px;
            font-size: clamp(30px, 4vw, 38px);
            line-height: 1.2;
        }
        
        .single-article__content b,
        .single-article__content strong,
        .single-article__content b *,
        .single-article__content strong * {
            font-weight: 800 !important;
        }
         
        .single-article__content h3 {
            margin: 38px 0 15px;
            color: #151515;
            font-size: clamp(24px, 3vw, 28px);
            line-height: 1.3;
        }

        .single-article__content p {
            margin: 0;
            color: #626262;
            font-size: 18px;
            line-height: 1.8;
        }

        .single-article__content ul,
        .single-article__content ol {
            margin: 12px 0 24px !important;
            padding-left: 28px !important;
            list-style-position: outside !important;
        }

        .single-article__content ul,
        .single-article__content ul > li {
            list-style-type: disc !important;
        }

        .single-article__content ol,
        .single-article__content ol > li {
            list-style-type: decimal !important;
        }

        .single-article__content li {
            margin: 0 0 8px !important;
            padding: 0 !important;
            color: #626262;
            font-size: 18px;
            line-height: 1.8;
        }

        .single-article__content .wp-block-table,
        .single-article__content .article-table {
            width: 100%;
            margin: 20px 0 30px;
            overflow-x: auto;
            border-radius: 10px;
        }
        .single-article__content h4 {
            margin-top:15px !important;
            margin-bottom:15px !important;
            
        }

        .single-article__content .wp-block-table table,
        .single-article__content .article-table table {
            width: 100%;
            min-width: 620px;
            border-collapse: collapse;
            background: #fff;
        }

        .single-article__content .wp-block-table th,
        .single-article__content .wp-block-table td,
        .single-article__content .article-table th,
        .single-article__content .article-table td {
            padding: 14px 18px;
            border: 1px solid #d9d9d9;
            color: #525252;
            font-size: 17px;
            line-height: 1.5;
            text-align: left;
            vertical-align: middle;
        }

        .single-article__content .wp-block-table tr:first-child td,
        .single-article__content .wp-block-table th,
        .single-article__content .article-table tr:first-child td,
        .single-article__content .article-table th {
            background: #ed1c24;
            color: #fff;
            font-weight: 700;
        }

        .single-article__content .wp-block-table tr:nth-child(even) td,
        .single-article__content .article-table tr:nth-child(even) td {
            background: #f8f8f8;
        }

        @media (max-width: 767.98px) {
            .single-article {
                padding: 60px 0 75px;
            }

            .single-article__image {
                margin-bottom: 30px;
                border-radius: 14px;
            }

            .single-article__content p {
                font-size: 16px;
                line-height: 1.7;
            }

            .single-article__content li {
                font-size: 16px;
                line-height: 1.7;
            }

            .single-article__content .wp-block-table th,
            .single-article__content .wp-block-table td,
            .single-article__content .article-table th,
            .single-article__content .article-table td {
                padding: 12px 14px;
                font-size: 15px;
            }
        }
      .seo-table-section {
                  padding: 20px 0 40px;
                }

                .seo-table-wrap {
                  width: 100%;
                  overflow-x: auto;
                  border-radius: 10px;
                }

                .single-article__content .seo-table {
                  width: 100% !important;
                  min-width: 700px;
                  margin: 0 !important;
                  border-collapse: collapse !important;
                  background: #fff;
                  box-shadow: 0 8px 24px rgba(0, 0, 0, .06);
                }

                .single-article__content .seo-table th {
                  padding: 16px 18px !important;
                  border: 1px solid #d9d9d9 !important;
                  color: #fff !important;
                  background: #ed1c24 !important;
                  font-size: 18px;
                  font-weight: 700;
                  text-align: left;
                  vertical-align: top;
                }

                .single-article__content .seo-table td {
                  padding: 18px !important;
                  border: 1px solid #d9d9d9 !important;
                  color: #525252;
                  font-size: 16px;
                  line-height: 1.7;
                  vertical-align: top;
                }

                .single-article__content .seo-table tr:nth-child(even) td {
                  background: #f8f8f8 !important;
                }

                @media (max-width: 768px) {
                  .single-article__content .seo-table th {
                    padding: 12px 14px !important;
                    font-size: 15px;
                  }

                  .single-article__content .seo-table td {
                    padding: 12px 14px !important;
                    font-size: 14px;
                  }
                }

                .single-article__content .faq-section {
                  padding: 30px 0 0 !important;
                }

                .single-article__content .faq-section .container {
                  width: 100%;
                  max-width: none;
                  padding: 0;
                }

                .single-article__content .faq-section h2 {
                  text-align: left !important;
                }

                .single-article__content .faq-section .accordion-item {
                  margin: 0;
                  padding: 0;
                  background: transparent;
                  border: 0;
                }

                .single-article__content .faq-section .accordion-header {
                  margin: 30px 0 12px;
                  padding: 0;
                }

                .single-article__content .faq-section .accordion-button,
                .single-article__content .faq-section .accordion-button:not(.collapsed) {
                  display: block;
                  width: 100%;
                  padding: 0;
                  color: #151515;
                  background: transparent;
                  border: 0;
                  box-shadow: none;
                  font-size: 24px;
                  font-weight: 700;
                  line-height: 1.35;
                  text-align: left;
                  pointer-events: none;
                }

                .single-article__content .faq-section .accordion-button::after {
                  display: none;
                }

                .single-article__content .faq-section .accordion-button br {
                  display: none;
                }

                .single-article__content .faq-section .accordion-collapse {
                  display: block !important;
                  height: auto !important;
                  visibility: visible !important;
                }

                .single-article__content .faq-section .accordion-body {
                  padding: 0;
                  color: #626262;
                  font-size: 18px;
                  line-height: 1.8;
                }

                .single-article__content .faq-section .accordion > p {
                  display: none;
                }