/* 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: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 100000 !important;
    pointer-events: auto;
}


/* 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: 1rem;
    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;
}

@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: 60px 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: 1rem;
    line-height: 1.3;
}

.seo-activity-card p {
    margin: 0;
    color: #5f6b7c;
    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: #e60023;
    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;
}

.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: 100px;
    overflow: hidden;
}

.portfolio-slider {
    padding: 30px 0 60px;
    overflow: visible !important;
}

.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 {
        margin-bottom: 28px;
    }
    .project-section .sec-title .title {
        font-size: clamp(1.9rem, 10vw, 2.65rem);
    }
    .project-section .mynewbutton {
        min-width: 150px;
        min-height: 44px;
        font-size: 13px;
    }
    .travelit-dest-grid {
        gap: 14px;
    }
    .travelit-dest-card,
    .travelit-dest-card.dest-card-1 {
        aspect-ratio: 1 / 1;
        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: 600 !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;
}

.hero-btn-wrapper .contact-btn.btn-flip::before,
.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;
}

.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;
}

.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-color: #050505;
    padding: 120px 0;
    position: relative;
    overflow: hidden;
    color: #ffffff;
}

.ambient-glow {
    position: absolute;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    filter: blur(120px);
    z-index: 0;
    opacity: 0.15;
    pointer-events: 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 */

.nexro-testimonial-section {
    position: relative;
    overflow: hidden;
    padding: 60px 0;
}

.nexro-testimonial-section .stats-header {
    margin-bottom: 60px;
}

.nexro-testimonial-section .stats-subtitle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #ffffff;
    border: 1px solid #eeeeee;
    padding: 6px 20px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 600;
    color: #1a1a1a;
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
    opacity: 1;
    transform: none;
    letter-spacing: normal;
    text-transform: none;
}

.nexro-testimonial-section .stats-subtitle::before {
    content: '';
    width: 8px;
    height: 8px;
    background: #ff5e14;
    border-radius: 50%;
    display: inline-block;
}

.nexro-testimonial-section .stats-title {
    font-size: clamp(36px, 5vw, 48px);
    font-weight: 700;
    color: #1a1a1a;
    letter-spacing: -1px;
    opacity: 1;
    transform: none;
}

.nexro-testi-slider {
    padding: 20px 10px 80px;
    position: relative;
    min-height: 420px;
}

.nexro-testi-slider .swiper-slide {
    width: 320px;
    transition: width 0.4s cubic-bezier(0.25, 1, 0.5, 1);
    will-change: width;
}

.nexro-testi-slider .swiper-slide-active {
    width: 700px;
}

.nexro-testi-card {
    height: 100%;
}

.testi-card-inner {
    background: #f6f6f6;
    border: 1px solid #f0f0f0;
    border-radius: 24px;
    padding: 30px;
    height: 100%;
    display: flex;
    gap: 0;
    box-shadow: none;
    transition: background-color 0.4s ease, box-shadow 0.4s ease, padding 0.4s ease;
    will-change: padding, background-color;
}

.swiper-slide-active .testi-card-inner {
    background: #ffffff;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.06);
    padding: 20px;
}

.testi-large-image {
    width: 0;
    opacity: 0;
    visibility: hidden;
    margin-right: 0;
    border-radius: 16px;
    background: #fdece2;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
    transition: width 0.5s ease, margin-right 0.5s ease, opacity 0.5s ease, visibility 0.5s ease;
}

.swiper-slide-active .testi-large-image {
    width: 320px;
    opacity: 1;
    visibility: visible;
    margin-right: 30px;
}

.testi-large-letter {
    display: none;
    font-size: 160px;
    font-weight: 700;
    color: rgba(0, 0, 0, 0.1);
    line-height: 1;
}

.testi-small-letter {
    font-size: 28px;
    font-weight: 700;
    color: rgba(0, 0, 0, 0.5);
    line-height: 1;
}

.testi-company-logo {
    position: absolute;
    bottom: 20px;
    left: 20px;
    max-width: 150px;
}

.testi-company-logo img {
    width: 100%;
    height: auto;
}

.testi-main-content {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.testi-top-bar {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 10px;
}

.user-thumb-small {
    width: 60px;
    height: 60px;
    border-radius: 16px;
    overflow: hidden;
    background: #e9e9e9;
    opacity: 1;
    visibility: visible;
    transition: width 0.5s ease, height 0.5s ease, opacity 0.3s ease, visibility 0.5s ease;
}

.swiper-slide-active .user-thumb-small {
    width: 0;
    height: 0;
    opacity: 0;
    visibility: hidden;
}

.swiper-slide-active .testi-top-bar {
    justify-content: flex-end;
}

.quote-icon {
    font-size: 40px;
    color: #1a1a1a;
    opacity: 0.1;
    line-height: 1;
}

.testi-quote-wrap {
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    position: relative;
    margin-bottom: 0;
    flex-grow: 1;
    overflow: hidden;
    display: flex;
    align-items: center;
    transition: max-height 0.4s cubic-bezier(0.25, 1, 0.5, 1), margin-bottom 0.4s ease, opacity 0.3s ease, visibility 0.4s ease;
    will-change: max-height, opacity;
}

.swiper-slide-active .testi-quote-wrap {
    max-height: 300px;
    opacity: 1;
    visibility: visible;
    margin-bottom: 20px;
}

.testi-quote-wrap::before {
    content: '\201D';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 300px;
    color: #ff5e14;
    opacity: 0.05;
    font-family: serif;
    line-height: 1;
    z-index: 0;
}

.testi-text {
    font-size: 20px;
    line-height: 1.6;
    color: #444;
    font-weight: 500;
    margin: 0;
    position: relative;
    z-index: 1;
}

.testi-divider {
    height: 1px;
    background: #eaeaea;
    margin: auto 0 20px 0;
}

.testi-footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.user-name {
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 4px;
}

.user-designation {
    font-size: 14px;
    color: #888;
    margin: 0;
}

.user-rating {
    display: flex;
    gap: 4px;
    color: #ff7b00;
    font-size: 14px;
}

.user-rating .fa-star {
    opacity: 1;
}

.user-rating .fa-star.inactive {
    color: #e0e0e0;
}

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

.nexro-testi-nav button {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #1a1a1a;
    cursor: pointer;
    transition: all 0.3s ease;
}

.nexro-testi-nav button:hover {
    border-color: #1a1a1a;
    background: #f9f9f9;
}

@media (max-width: 991px) {
    .nexro-testi-slider .swiper-slide-active {
        width: 100%;
    }
    .testi-large-image {
        display: none !important;
    }
    .swiper-slide-active .user-thumb-small {
        display: block;
    }
    .swiper-slide-active .testi-top-bar {
        justify-content: space-between;
    }
}

.stats-header {
    position: relative;
    z-index: 2;
    margin-bottom: 80px;
}

.stats-subtitle {
    display: block;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: #e60023;
    margin-bottom: 15px;
    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: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 32px;
    padding: 50px 40px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(12px);
    transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.02);
}

.nexro-stat-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 32px;
    padding: 1px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), transparent 50%, rgba(230, 0, 35, 0.2));
    -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: rgba(255, 255, 255, 0.05);
    border-color: rgba(230, 0, 35, 0.3);
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5), inset 0 0 30px rgba(230, 0, 35, 0.05);
}

.stat-label {
    font-size: 13px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.5);
    letter-spacing: 2px;
    margin-bottom: 15px;
    text-transform: uppercase;
}

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

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

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

.card-glow {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(230, 0, 35, 0.15) 0%, transparent 60%);
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.nexro-stat-card:hover .card-glow {
    opacity: 1;
}


/* Responsive adjustments */

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

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

@media (max-width: 767px) {
    .stats-title {
        font-size: 32px;
    }
    .stat-number {
        font-size: 48px;
    }
}

.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(22vw, 320px);
    will-change: transform;
    transform-style: preserve-3d;
    top: 50%;
    left: 50%;
}

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

.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(24vw, 250px);
        top: 50%;
        left: 50%;
    }
    .brand-shine-card-inner {
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    .brand-shine-section {
        padding-top: 24px;
    }
    .brand-shine-stage {
        display: block;
        min-height: 58vh;
        padding: 28px 14px 36px;
        gap: 0;
    }
    .brand-shine-title {
        font-size: clamp(2rem, 11vw, 3.2rem);
        line-height: 0.9;
        letter-spacing: 0;
    }
    .brand-shine-link {
        font-size: 13px;
    }
    .brand-shine-content {
        position: absolute;
        inset: 0;
        z-index: 4;
        gap: 10px;
        padding: 18px 12px 14px;
    }
    .brand-shine-laptop-wrap {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        position: absolute;
        inset: 100px 0 auto;
        height: auto;
        margin: 0;
        z-index: 2;
    }
    .brand-shine-laptop {
        width: min(92vw, 420px);
    }
    .brand-shine-laptop-screen {
        height: 170px;
        border-width: 7px;
        border-bottom-width: 8px;
        border-radius: 18px 18px 10px 10px;
    }
    .brand-shine-laptop-base {
        height: 16px;
        border-radius: 0 0 18px 18px;
    }
    .brand-shine-laptop-trackpad {
        top: 3px;
        height: 7px;
    }
    .brand-shine-card {
        display: none;
    }
    .brand-shine-card-inner {
        border-radius: 12px;
        box-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);
    }
}

@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: 120px 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;
    padding: 100px 0;
    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: 600px;
    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);
}

.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;
    color: #dd3338;
    font-size: 32px;
}

html {
    scroll-behavior: smooth;
}


/* Modern CTA Section */

.modern-cta-section {
    padding: 60px 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: 110px 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: 0;
    transform: translateY(36px);
}

.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: 0;
    transform: scale(0.94);
}

.process-section.process-horizontal .process-path-main,
.process-section.process-horizontal .process-path-shadow,
.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: 100vh;
    height: 100vh;
    padding: 0;
}

.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: .9;
    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: 118px;
    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: 0;
    pointer-events: none;
    transform-origin: 50% 92%;
    will-change: auto;
}

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

.process-section.process-horizontal.is-ready .process-scroll-man {
    opacity: 1;
}

.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;
}

.saar-why-scroll-wrap {
    position: relative;
}

.saar-why-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) 48px minmax(0, .95fr);
    gap: 0 32px;
    align-items: stretch;
    min-height: 560px;
    width: 100%;
}

.saar-why-layout>* {
    min-width: 0;
}

.saar-why-media-col {
    position: relative;
    height: 100%;
    overflow: hidden;
}

.saar-why-media-viewport {
    position: relative;
    height: 560px;
    width: 100%;
    border-radius: 28px;
    overflow: hidden;
}

.saar-why-media-track {
    display: flex;
    flex-direction: column;
    gap: 22px;
    will-change: transform;
}

.saar-why-slide {
    flex-shrink: 0;
    /* height: 560px; */
    border-radius: 28px;
    overflow: hidden;
}

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

.saar-why-slide--brand {
    background: linear-gradient(145deg, #1a1a1a, #0d0d0d);
}

.saar-why-slide--brand img {
    object-fit: contain;
    /* padding: 48px 56px; */
}

.saar-why-progress-col {
    display: flex;
    justify-content: center;
    align-items: stretch;
    padding: 12px 0;
}

.saar-why-progress {
    position: relative;
    width: 2px;
    height: 100%;
    min-height: 560px;
}

.saar-why-progress-track {
    position: absolute;
    inset: 0;
    background: rgba(17, 17, 17, .12);
    border-radius: 999px;
}

.saar-why-progress-fill {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #e60023, #ff4d6d);
    border-radius: 999px;
    transform: scaleY(0);
    transform-origin: top center;
    box-shadow: 0 0 18px rgba(230, 0, 35, .55);
}

.saar-why-cards-col {
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    min-height: 560px;
    overflow: hidden;
}

.saar-why-card {
    padding: 16px 20px 14px;
    border: 1px solid rgba(17, 17, 17, .06);
    border-radius: 18px;
    background: #ffffff;
    transition: border-color .45s ease, background .45s ease, box-shadow .45s ease, transform .45s cubic-bezier(.22, 1, .36, 1), color .45s ease;
}

.saar-why-card-num {
    display: block;
    margin-bottom: 4px;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #e60023;
    transition: color .45s ease;
}

.saar-why-card h3 {
    margin: 0 0 6px;
    font-size: 1.08rem;
    font-weight: 500;
    line-height: 1.25;
    color: #111;
    letter-spacing: -.02em;
    transition: color .45s ease;
}

.saar-why-card p {
    margin: 0;
    font-size: .84rem;
    line-height: 1.55;
    color: rgba(17, 17, 17, .72);
    transition: color .45s ease;
}

.saar-why-card.is-active .saar-why-card-num {
    color: #ff6b84;
}

.saar-why-card.is-active {
    border-color: rgba(230, 0, 35, .35);
    background: #262626;
    transform: translateX(6px);
    color: #fff !important;
}

.saar-why-card.is-active h3 {
    color: #ffffff;
}

.saar-why-card.is-active p {
    color: rgb(255 255 255 / 82%);
}

@media (max-width: 991px) {
    .saar-why-layout {
        grid-template-columns: 1fr;
        gap: 28px;
        min-height: auto;
    }
    .saar-why-media-viewport {
        height: 320px;
    }
    .saar-why-slide {
        height: 320px;
    }
    .saar-why-progress-col {
        order: 3;
        padding: 0;
    }
    .saar-why-progress {
        width: 100%;
        height: 2px;
        min-height: 0;
    }
    .saar-why-progress-track,
    .saar-why-progress-fill {
        inset: auto 0;
        width: 100%;
        height: 2px;
    }
    .saar-why-progress-fill {
        transform-origin: left center;
    }
    .saar-why-cards-col {
        min-height: auto;
    }
}


/* 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__info {
    margin-top: 32px;
}

.contact-details__info li {
    gap: 18px;
}

.contact-details__info li .icon {
    flex: 0 0 46px;
    width: 46px !important;
    height: 46px !important;
    border-radius: 50%;
    background: #ffffff !important;
    color: #151515 !important;
    border: 1px solid rgba(230, 0, 35, 0.22);
    box-shadow: 0 10px 28px rgba(21, 21, 21, 0.08);
}

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

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

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

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

.contact-details__info li .text h5 {
    color: #111111;
    font-size: 18px;
    line-height: 1.25;
}

.contact-details__info li .text a,
.contact-details__info li .text span {
    color: #6f747a !important;
    font-size: 17px !important;
    line-height: 1.45;
}

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

.contact-details__right .sub-title {
    color: #6f747a !important;
}

.contact-details__right .sub-title svg {
    color: #a61622;
    opacity: 0.65;
}

.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: 575.98px) {
    .contact-details__info li {
        display: flex !important;
        align-items: center !important;
    }
    .contact-details__info li .icon {
        flex-basis: 42px;
        width: 42px !important;
        height: 42px !important;
    }
    .contact-details__info li .icon span {
        font-size: 16px !important;
    }
    .map-section iframe {
        height: 420px;
        min-height: 420px;
    }
}

@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;
}

.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: #e60023 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='%23ffffff' 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: 50px 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: 1.05rem;
    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 {
    background: #e60023;
    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;
}


/* 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: 154px;
    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 {
    background: #e60023;
    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: 50px 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 {
        padding: 80px 0;
    }
    .smm-services-section h2 {
        font-size: 36px;
    }
}

@media (max-width: 767px) {
    .smm-services-section {
        padding: 60px 0;
    }
    .smm-services-section h2 {
        font-size: 32px;
    }
    .smm-service-card {
        margin-bottom: 24px;
    }
}

.why-social-section {
    position: relative;
    padding: 0px 20px;
    padding-bottom: 80px !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: 80px 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;
    }
}

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


/* =========================================
BEST ADVERTISING MANAGEMENT AGENCY SECTION 
========================================= */

.agency-min-section {
    position: relative;
    padding: 60px 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;
}


/* 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%);
}

.agency-min-image:hover img {
    transform: scale(1.04) translateZ(30px);
    /* होवर करने पर 100% ओरिजिनल कलर */
    filter: grayscale(0%);
}

@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;
}

.agency-min-content h2 {
    color: #1d1d1d;
    line-height: 1.1;
    margin-bottom: 32px;
    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: 80px 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;
    }
    .agency-min-text p {
        padding-left: 18px;
        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;
}

.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: 60px;
    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;
}


/* =========================================
   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-wrapper img {
        /* Reset height for mobile so it doesn't look overly stretched */
        height: auto;
        aspect-ratio: 16/9;
    }
    .saar-reveal-left,
    .saar-reveal-right {
        transform: translateY(40px);
    }
}


/* ------ */


/* Our Advertising/ PPC Services
 Layout & Grid Setup */

.v-scroll-ppc-wrapper {
    padding: 80px 24px;
    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: 600;
    display: flex;
    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;
}

.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: 60px 16px;
    }
    .v-scroll-ppc-content {
        padding: 28px 24px;
    }
}


/* ------------- */


/* --- Base Architecture --- */

.saar-premium-section {
    padding: 20px 30px;
    overflow: hidden;
    display: flex;
    justify-content: center;
}

.saar-premium-container {
    max-width: 1200px;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    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%;
}


/* 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: 34px;
    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: #e60023;
    border-color: #e60023;
    transform: translateY(-5px) rotate(-5deg);
    box-shadow: 0 18px 40px rgba(230, 0, 35, 0.18);
}

.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;
    margin-bottom: 16px;
}

.nxq-service-content p {
    color: rgba(29, 29, 29, 0.72);
    line-height: 1.9;
    margin: 0;
}


/* =========================================
   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: 5rem 2rem;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

.saar-light-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.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;
}

.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: 70px 0 80px;
    }
    .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;
}

@media screen and (max-width: 767px) {
    .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;
}