/* ============================================================
   AI Hero — full-screen cinematic intro section
   ============================================================ */

.ai-hero {
    position: relative;
    overflow: hidden;
    font-family: "Product Sans", Arial, sans-serif;
    margin: 8px 8px 0 8px;
    border-radius: 10px;
}

/* Poster + video layer stack */
.ai-hero__media {
    position: absolute;
    inset: 0;
    z-index: 0;
}

/* Poster — shown instantly, never blank while the video buffers */
.ai-hero__poster {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 0;
}

/* Video background — fades in over the poster once it can play */
.ai-hero__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 1;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.6s ease;
}

.ai-hero__video.is-ready {
    opacity: 1;
}
a.new-hero-btn:focus {
    color: #fff;
}
/* Dark cinematic overlay */
.ai-hero__overlay {
    position: absolute;
    inset: 0;
    background: rgba(8, 12, 30, 0.55);
    z-index: 1;
}

/* Flex column body — drives section height */
.ai-hero__body {
    position: relative;
    z-index: 2;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 84px 24px 44px;
}

@supports (min-height: 100svh) {
    .ai-hero__body {
        min-height: 100svh;
    }
}

/* Text stage — fills all vertical space between header and cards */
.ai-hero__text-stage {
    flex: 1;
    position: relative;
    width: 100%;
    max-width: 1040px;
}

/* Phrases and final heading — all stacked in same space */
.ai-hero__phrase,
.ai-hero__final {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin: 0;
    padding: 0 20px;
    text-align: center;
    color: #fff;
    font-size: clamp(28px, 5vw, 100px);
    font-weight: 300;
    line-height: 1.1;
    letter-spacing: -0.025em;
    opacity: 0;
    transform: translateY(calc(-50% + 28px));
    transition: opacity 0.88s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                transform 0.88s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    pointer-events: none;
}

.ai-hero__final {
    font-size: clamp(36px, 6.5vw, 100px);
}

.ai-hero__phrase.is-active,
.ai-hero__final.is-active {
    opacity: 1;
    transform: translateY(-50%);
    pointer-events: auto;
}

.ai-hero__phrase.is-exit {
    opacity: 0;
    transform: translateY(calc(-50% - 28px));
    transition: opacity 0.62s ease, transform 0.62s ease;
}

/* Cards wrapper */
.ai-hero__cards-wrap {
    flex-shrink: 0;
    width: 100%;
    max-width: 1240px;
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.88s ease, transform 0.88s ease;
    pointer-events: none;
}

.ai-hero__cards-wrap.is-active {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* 4-column grid */
.ai-hero__cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

/* Individual card */
.ai-hero__card {
    background: #fff;
    border-radius: 10px;
    padding: 16px 16px 20px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.18);
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 12px;
    min-height: 150px;
}

/* Image on the left */
.ai-hero__card-icon {
    width: 80px;
    border-radius: 7px;
    /* background: #eef1fb; */
    flex-shrink: 0;
    overflow: hidden;
}

.ai-hero__card-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Content on the right */
.ai-hero__card-content {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.ai-hero__card-title {
        margin: 23px 5px 0;
    font-size: 16px;
    font-weight: 600;
    color: #000000;
    line-height: 1.42;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    overflow: hidden;
    max-height: calc(1.42em * 2);
}

.ai-hero__card-link {
    display: inline-block;
    align-self: flex-end;
    font-size: 12.5px;
    font-weight: 600;
    color: #014088;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
    transition: color 0.2s ease;
    margin-top: auto;
}
.ai-hero__card-link:focus {
    text-decoration: underline;
}

.ai-hero__card-link:hover {
    color: #2654d6;
}

.ai-hero__card-sub {
    margin: 0;
    font-size: 12.5px;
    color: #606888;
    line-height: 1.35;
    margin-top: auto;
}

.ai-hero__card-sub span {
    color: #014088;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
}

/* ---- Tablet ---- */
@media (max-width: 1024px) {
    .ai-hero__cards {
        grid-template-columns: repeat(2, 1fr);
    }
    .new-research-grid {
        grid-auto-rows: auto !important;
    }
    .aimvp-page p {
    margin-bottom: 10px;
}
}

/* ---- Mobile ---- */
@media (max-width: 640px) {
    .ai-hero__body {
        padding: 88px 16px 32px;
    }

    .ai-hero__text-stage {
        min-height: 180px;
    }

    .ai-hero__cards {
        grid-template-columns: repeat(2, 1fr);
    }

    .ai-hero__card {
        flex-direction: column;
        min-height: 0;
        padding: 12px;
        gap: 8px;
    }

    .ai-hero__card-icon {
        width: 56px;
        height: 56px;
    }

    .ai-hero__card-icon img {
        object-fit: contain;
    }

    .ai-hero__card-content {
        flex: none;
    }
}

/* ============================================================
   End AI Hero
   ============================================================ */

/* ---- Header scroll-hide / show ---- */
.new-header__bar {
    transition: background 0.35s ease, backdrop-filter 0.35s ease,
                box-shadow 0.35s ease,
                transform 0.36s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.new-header__bar.nh-hidden {
    transform: translateY(-120%);
}

.new-hero-section {
    font-family: "Product Sans", Arial, sans-serif;
    padding: 38px 20px 58px;
    background: #fff;
    color: #121331;
}

.new-hero-wrap {
  
    margin: 0 auto;
}

.new-hero-head {
    max-width: 820px;
    margin: 0 auto 68px;
    text-align: center;
}

.new-hero-head h2, .new-industries-head h2 ,.new-research-head h2 {
    margin: 0 0 10px;
    font-size: 32px;
    line-height: 1.2;
    font-weight: 600;
    color: #000;
}
.new-hero-head h1 {
    font-size: 54px;
    margin-bottom: 30px;
}
.new-hero-head h1 span {
    color: #014088;
    font-weight: 500;
}

.new-hero-head p {
    max-width: 790px;
    margin: 0 auto 16px;
    font-size: 18px;
    line-height: 1.45;
    color: #121331;
}

.new-hero-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 35px;
    padding: 0 17px;
    border-radius: 7px;
    background: #014088;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 14px 26px rgba(91, 71, 155, 0.28);
    transition: 0.3s ease;
}

.new-hero-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 34px rgba(91, 71, 155, 0.36);
    background-color: #014088;
    color: #fff !important;
}

.new-hero-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    align-items: stretch;
}

.new-hero-card {
    position: relative;
    min-height: 340px;
    border-radius: 16px;
    background: transparent;
    display: flex;
    flex-direction: column;
    transform: translateZ(0) scale(1);
    transition: transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: transform;
}

.new-hero-card:hover {
    transform: translateZ(0) scale(1.06);
}

.new-hero-visual {
    height: 160px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    overflow: hidden;
}

.new-hero-visual h3 {
    margin: 0;
    font-size: 35px;
    line-height: 1.1;
    font-weight: 600;
    color: #fff;
    text-align: center;
    letter-spacing: -0.03em;
    text-shadow: 0 12px 28px rgba(0, 0, 0, 0.2);
    margin-bottom: 20px;
}

.new-hero-gradient-1 {
    background:
        radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.68), transparent 28%),
        linear-gradient(135deg, #ff7a59 0%, #ff4f86 42%, #6d5dfc 100%);
}

.new-hero-gradient-2 {
    background:
        radial-gradient(circle at 80% 15%, rgba(255, 255, 255, 0.72), transparent 30%),
        linear-gradient(135deg, #9be7ff 0%, #8f8cff 48%, #5a45d6 100%);
}

.new-hero-gradient-3 {
    background:
        radial-gradient(circle at 18% 85%, rgba(255, 255, 255, 0.62), transparent 30%),
        linear-gradient(135deg, #7cf6d1 0%, #34b8ff 45%, #7347ff 100%);
}

.new-hero-gradient-4 {
    background:
        radial-gradient(circle at 75% 25%, rgba(255, 255, 255, 0.68), transparent 30%),
        linear-gradient(135deg, #f4b7ff 0%, #8c6dff 45%, #261b6f 100%);
}

.new-hero-content {
    position: relative;
    z-index: 2;
    width: calc(100% - 32px);
    min-height: 180px;
    flex: 1;
    margin: -42px auto 0;
    padding: 24px 18px 22px;
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 16px 28px rgba(102, 72, 150, 0.18);
    display: flex;
    flex-direction: column;
}

.new-hero-content p {
    margin: 0;
    font-size: 16px;
    line-height: 1.55;
    color: #444444;
}


.new-hero-link {
    display: inline-flex;
    width: max-content;
    margin-top: auto;
    padding-top: 16px;
    color: #000000;
    font-size: 15px;
    font-weight: 500;
    text-decoration: underline;
    text-underline-offset: 5px;
    opacity: 1;
    transform: none;
    pointer-events: auto;
}

/* Clicking/tapping the link leaves it holding browser focus (e.g. after
   target="_blank" navigation), which matches the global a:focus/a:hover
   rules and makes it look permanently "hovered" until something else is
   clicked. Reset it back to the resting style whenever focus wasn't put
   there by keyboard navigation, so only real :hover shows the hover look. */
.new-hero-link:focus:not(:focus-visible) {
    color: #000000;
    text-decoration: underline;
}
.new-landing-page .container{
  max-width: 1470px !important;
  width: 100%;
}
section.new-hero-section {
    padding-top: 80px;
}

/* ============================================================
   Build Page
   ============================================================ */
.build-page .container {
    max-width: 1280px !important;
    width: 100%;
}

.build-hero {
    position: relative;
    overflow: hidden;
    padding: 230px 0 120px;
    background:
        radial-gradient(circle at top right, rgba(1, 64, 136, 0.08), transparent 32%),
        linear-gradient(180deg, #ffffff 0%, #f7faff 100%);
}

.build-hero::before,
.build-hero::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
    filter: blur(18px);
    opacity: 0.8;
}

.build-hero::before {
    width: 160px;
    height: 160px;
    right: -36px;
    top: 28px;
    background: rgba(1, 64, 136, 0.08);
}
section.blockchain-dev-company-hero {
    background-image: url('/images/blockchain-development_banner.webp') !important;
}

section.ai-development-services-hero {
    background-image: url('/images/AI-Development-Consulting.webp') !important;
}

section.ai-sf-hero {
    background-image: url('/images/ai-consulting-hero.webp') !important;
}
section.build-hero {
    background-image: url('/images/Build-Digital-Products-new.webp');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}
section.scale-hero{
    background-image: url('/images/scale-bg.webp') !important;
}
section.specialization-hero{
    background-image: url('/images/specialization-main.webp') !important;
}
section.transform-hero {
    background-image: url('/images/Transform-Digital-Businesses-2.webp') !important;
}
section.mvp-hero {
    background-image: url('/images/ai-mvp-hero.webp') !important;
}
section.saas-product-hero {
    background-image: url('/images/saas-development-hero.webp') !important;
}
section.devops-cloud {
    background-image: url('/images/devops-hero.webp') !important;
}
section.managed-engineering {
    background-image: url('/images/managed-engineering-hero.webp') !important;
}

section.custom-web-content {
   background-image: url('/images/managed-engineering-hero.webp') !important;
}
section.offshore-development-center {
    background-image: url('/images/managed-engineering-hero.webp') !important;
}
section.ai-agent-development {
    background-image: url('/images/ai-agent-hero.webp') !important;
}
section.ai-consulting-hero {
    background-image: url('/images/ai-consulting-hero.webp') !important;
}
section.cloud-migration-hero {
    background-image: url('/images/cloud-migration-hero.webp') !important;
}
section.process-automation-hero {
    background-image: url('/images/ai-process-hero.webp') !important;
}
/* Placeholder hero images below use managed-engineering-hero.webp until a
   page-specific photo is ready. Each keeps its own class so the background
   can be swapped in one at a time without touching markup. */
section.ai-automation-hero {
    background-image: url('/images/ai-automation-hero.webp') !important;
}
section.ai-automation-enterprise-workflow-platforms {
    background-image: url('/images/automotive-hero.webp') !important;
}
section.blockchain-web3-hero {
    background-image: url('/images/blockchain-hero.webp') !important;
}
section.fintech-hero {
    background-image: url('/images/fintech-hero.webp') !important;
}
section.healthcare-hero {
    background-image: url('/images/healthcare-hero.webp') !important;
}
section.logistics-hero {
    background-image: url('/images/logistics-hero.webp') !important;
}
section.proptech-hero {
    background-image: url('/images/proptech-hero.webp') !important;
}
section.retail-commerce-hero {
    background-image: url('/images/retail-hero.webp') !important;
}
section.crypto-exchange-hero {
    background-image: url('/images/currency_exchange.jpg') !important;
}
section.defi-development-hero {
    background-image: url('/images/fintech-hero.webp') !important;
}
section.defi-lottery-hero {
    background-image: url('/images//managed-engineering-hero.webp') !important;
}
section.services-hero {
    background-image: url('/images/Build-Digital-Products-new.webp') !important;
}
section.launchready-hero {
    background-image:  url('/images/ai-consulting-hero.webp') !important;
}
section.webapp-hero {
    background-image: url('/images/webappdev_banner.jpg') !important;
}
section.process-hero {
    background-image: url('/images/scale-bg.webp') !important;
}
section.resources-hero {
    background-image: url('/images/specialization-main.webp') !important;
}
section.build-hero::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(8, 12, 30, 0.78);
    border-radius: unset;
    box-shadow: unset;
    opacity: 1;
    filter: un;
}
.build-hero::after {
    width: 220px;
    height: 220px;
    left: -90px;
    bottom: -96px;
    background: rgba(9, 106, 216, 0.06);
}

.build-hero__inner {
    position: relative;
    z-index: 1;
    max-width: 1100px;
    margin: 0 auto;
    text-align: center;
}

.build-pill,
.build-section-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 16px;
    border-radius: 999px;
    background: rgba(1, 64, 136, 0.08);
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: none;
}
span.build-pill {
    background: #014088;
    gap:8px
}

.build-hero h1 {
    margin: 22px auto 20px;
    max-width: 1100px;
    color: #fff;
    font-size: clamp(40px, 5vw, 72px);
    line-height: 1.03;
    font-weight: 700;
    letter-spacing: -0.045em;
}
a.rounded-btn-fill {
    background: #ffffff;
}
.build-hero p {
    color: #fff;
    font-size: 18px;
    line-height: 1.72;
}

.build-services {
    padding: 80px 0 110px;
    background: #fff;
}

.build-services__head {
    max-width: 100%;
    margin: 0 0 34px;
    text-align: left;
}

.build-services__head h2 {
    margin: 0;
    color: #06122f;
    font-size: clamp(30px, 3.5vw, 48px);
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -0.04em;
}

.build-services__head h2 span {
    color: #014088;
}

.build-services__grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-auto-rows: 78px;
    gap: 14px;
    align-items: stretch;
    margin-top: 12px;
    grid-auto-flow: dense;
}

.build-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 100%;
    padding: 20px 30px;
    border-radius: 28px;
    background: #fff;
    border: 1px solid rgba(1, 64, 136, 0.08);
    box-shadow: 0 12px 30px rgba(6, 18, 47, 0.08);
    overflow: hidden;
    color: #06122f;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease, background-color 0.35s ease;
}

.build-card:visited {
    color: #06122f;
}

.build-card::after {
    content: "";
    position: absolute;
    inset: auto -54px -54px auto;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(1, 64, 136, 0.08) 0%, rgba(1, 64, 136, 0) 72%);
    pointer-events: none;
}

/* Stretched link: keeps the whole card clickable while leaving the
   title/description text outside the anchor so it stays selectable/copyable. */
.build-card__link {
    position: absolute;
    inset: 0;
    z-index: 0;
    text-decoration: none;
}

.build-card:hover,
.build-card:focus-visible {
    transform: translateY(-6px);
    background: #014088;
    box-shadow: 0 22px 50px rgba(1, 64, 136, 0.22);
    border-color: rgba(1, 64, 136, 0.22);
    color: #fff;
    outline: none;
}

.build-card__meta {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 12px;
}

.build-card__index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    height: 48px;
    padding: 0 14px;
    border-radius: 999px;
    background: rgba(1, 64, 136, 0.08);
    color: #014088;
    border: 1px solid rgba(1, 64, 136, 0.12);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.04em;
    transition: background-color 0.35s ease, color 0.35s ease, border-color 0.35s ease;
}

.build-card__body {
    position: relative;
    z-index: 1;
}

.build-card h3 {
    margin: 0 0 12px;
    font-size: 30px;
    line-height: 1.18;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: inherit;
    transition: color 0.35s ease;
}

.build-card p {
    margin: 0;
    color: #44506f;
    font-size: 18px;
    line-height: 1.65;
    transition: color 0.35s ease;
}

.build-card:hover h3,
.build-card:hover p,
.build-card:hover .build-card__index,
.build-card:focus-visible h3,
.build-card:focus-visible p,
.build-card:focus-visible .build-card__index {
    color: #fff;
}

.build-card:hover .build-card__index,
.build-card:focus-visible .build-card__index {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.18);
}

.build-card--wide {
    min-height: 100%;
}

.build-card--tall {
    min-height: 100%;
}

.build-card--half {
    min-height: 100%;
}

.build-services__grid > .build-card:nth-child(1) {
    grid-column: 1 / span 4;
    grid-row: 1 / span 5;
}

.build-services__grid > .build-card:nth-child(2) {
    grid-column: 5 / span 4;
    grid-row: 1 / span 2;
}

.build-services__grid > .build-card:nth-child(3) {
    grid-column: 9 / span 4;
    grid-row: 1 / span 2;
}

.build-services__grid > .build-card:nth-child(4) {
    grid-column: 5 / span 5;
    grid-row: 3 / span 3;
}

.build-services__grid > .build-card:nth-child(5) {
    grid-column: 1 / span 8;
    grid-row: 6 / span 3;
}

.build-services__grid > .build-card:nth-child(6) {
    grid-column: 10 / span 3;
    grid-row: 3 / span 6;
}

.build-cta {
    padding: 60px 0 80px;
    background: #fff;
}

.build-cta__box {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 38px 40px;
    border-radius: 32px;
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.18), transparent 30%),
        linear-gradient(135deg, #014088 0%, #0c5cbc 100%);
    box-shadow: 0 24px 60px rgba(1, 64, 136, 0.22);
    overflow: hidden;
}

.build-cta__box::before {
    content: "";
    position: absolute;
    right: -70px;
    top: -60px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    pointer-events: none;
}

.build-cta__content {
    position: relative;
    z-index: 1;
    max-width: 1100px;
}

.build-section-kicker--light {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

.build-cta h2 {
    margin: 18px 0 12px;
    color: #fff;
    font-size: clamp(28px, 3.4vw, 44px);
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -0.04em;
}

.build-cta p {
    margin: 0;
    color: rgba(255, 255, 255, 0.9);
    font-size: 18px;
    line-height: 1.7;
}

.build-cta__btn {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 24px;
    border-radius: 999px;
    background: #fff;
    color: #014088;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.16);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.build-cta__btn:hover {
    /* transform: translateY(-2px); */
    color: #014088;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.2);
}

@media (max-width: 1100px) {
    .build-services__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: auto;
    }

    .build-services__grid > .build-card:nth-child(n) {
        grid-column: auto;
        grid-row: auto;
    }

    .build-card {
        min-height: 240px;
    }
}

@media (max-width: 767px) {
    .build-hero {
        padding: 90px 0 70px;
    }

    .build-services {
        padding: 18px 0 84px;
    }

    .build-cta {
        padding: 0 0 92px;
    }

    .build-hero h1 {
        margin-top: 18px;
    }

    .build-services__head { margin-bottom: 24px; }

    .build-services__grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .build-services__grid > .build-card:nth-child(n) {
        grid-column: auto;
        grid-row: auto;
    }

    .build-card {
        min-height: 220px;
        padding: 24px 22px 22px;
        border-radius: 24px;
    }

    .build-card h3 {
        font-size: 22px;
    }

    .build-card p,
    .build-hero p,
    .build-cta p {
        font-size: 18px;
    }

    .build-cta__box {
        flex-direction: column;
        align-items: flex-start;
        padding: 28px 22px;
        border-radius: 26px;
    }

    .build-cta__btn {
        width: 100%;
    }
    .nft-hero-offer {
    align-items: unset;
   
    background: unset;
    border: unset;
  
}
.build-pill, .build-section-kicker {
    font-size: 13px;
    font-weight: 500; 
}
}

@media (max-width: 575px) {
    .build-hero {
        padding: 90px 0 58px;
    }

    .build-hero h1 {
        font-size: clamp(35px, 7vw, 46px);
    }

    .build-services__head h2 {
        font-size: 28px;
    }
}

/* Scale page: 7-card "Solutions we offer" premium masonry grid (services/scale/index.php) */
.scale-page .build-services {
    background: #f4f6fb;
}

.scale-services__grid .build-card {
    border-radius: 18px;
    padding: 20px 28px;
}

.scale-services__grid .build-card__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.scale-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: rgba(1, 64, 136, 0.08);
    color: #014088;
    font-size: 18px;
    flex-shrink: 0;
    transition: background-color 0.35s ease, color 0.35s ease;
}

.build-card:hover .scale-card__icon,
.build-card:focus-visible .scale-card__icon {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
}

.scale-card__icon-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 90px;
    margin: 4px 0 18px;
}

.scale-card__icon--lg {
    width: 110px;
    height: 110px;
    border-radius: 24px;
    font-size: 55px;
}

.scale-services__grid .build-card h3 {
    font-size: 24px;
    margin: 0 0 15px;
}

.scale-services__grid .build-card p {
    font-size: 17px;
    line-height: 1.4;
}

.scale-card--merged .scale-card__icon {
    width: 52px;
    height: 52px;
    font-size: 22px;
}

@media (min-width: 1101px) {
    .scale-card--merged h3 {
        font-size: 30px;
    }

    .scale-card--merged p {
        max-width: 640px;
    }
}

@media (min-width: 1101px) {
    .scale-services__grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-template-rows: repeat(3, minmax(0, auto));
        grid-template-areas:
            "card1 card2 card3"
            "card1 card4 card5"
            "card6 card7 card7";
        grid-auto-rows: auto;
        align-items: stretch;
        gap: 20px;
    }

    .scale-services__grid > .build-card {
        height: auto;
        min-height: 0;
    }

    .scale-services__grid > .build-card:nth-child(1) { grid-area: card1; }
    .scale-services__grid > .build-card:nth-child(2) { grid-area: card2; }
    .scale-services__grid > .build-card:nth-child(3) { grid-area: card3; }
    .scale-services__grid > .build-card:nth-child(4) { grid-area: card4; }
    .scale-services__grid > .build-card:nth-child(5) { grid-area: card5; }
    .scale-services__grid > .build-card:nth-child(6) { grid-area: card6; }
    .scale-services__grid > .build-card:nth-child(7) { grid-area: card7; }
}

@media (max-width: 767px) {
    .scale-services__grid .build-card {
        padding: 22px 20px 20px;
        border-radius: 16px;
    }

    .scale-services__grid .build-card h3 {
        font-size: 19px;
    }

    .scale-card__icon {
        width: 60px;
        height: 40px;
        font-size: 16px;
    }

    .scale-card__icon--lg {
        width: 68px;
        height: 68px;
        font-size: 28px;
    }

    .scale-card__icon-wrap {
        min-height: 70px;
        margin: 0 0 12px;
    }
}

/* Specialization page: 8-card "Solutions we offer" grid (services/specialization/index.php) */
/* Same masonry template as .scale-services__grid, plus a 4th row for the 8th card. */
@media (min-width: 1101px) {
    .specialization-scale-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-template-rows: repeat(4, minmax(0, auto));
        grid-template-areas:
            "card1 card2 card2"
            "card1 card3 card4"
            "card5 card6 card6"
            "card7 card7 card8";
        grid-auto-rows: auto;
    }

    .specialization-scale-grid > .build-card {
        height: auto;
        min-height: 0;
    }

    .specialization-scale-grid > .build-card:nth-child(1) { grid-area: card1; }
    .specialization-scale-grid > .build-card:nth-child(2) { grid-area: card2; }
    .specialization-scale-grid > .build-card:nth-child(3) { grid-area: card3; }
    .specialization-scale-grid > .build-card:nth-child(4) { grid-area: card4; }
    .specialization-scale-grid > .build-card:nth-child(5) { grid-area: card5; }
    .specialization-scale-grid > .build-card:nth-child(6) { grid-area: card6; }
    .specialization-scale-grid > .build-card:nth-child(7) { grid-area: card7; }
    .specialization-scale-grid > .build-card:nth-child(8) { grid-area: card8; }
}

/* third section css */
.new-industries-section {
    font-family: "Product Sans", Arial, sans-serif;
    padding: 90px 20px 80px;
    background: #f4f6fb;
    color: #000000;
}

.new-industries-wrap {
    max-width: 1280px;
    margin: 0 auto;
}

.new-industries-head {
    max-width: 700px;
    margin: 0 auto 68px;
    text-align: center;
}


.new-industries-head p {
    max-width: 650px;
    margin: 0 auto;
    font-size: 18px;
    line-height: 1.45;
    color: #34384a;
}

.new-industries-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 70px;
}

.new-industries-col {
    display: flex;
    flex-direction: column;
    gap: 34px;
}

.new-industries-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    width: max-content;
    max-width: 100%;
    color: #014088;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.35s ease, transform 0.35s ease;
}

.new-industries-link::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 100%;
    height: 1px;
    background: currentColor;
    transform: scaleX(1);
    transform-origin: left;
    transition: transform 0.4s ease;
}

.new-industries-link::after {
    content: "↗";
    margin-left: 8px;
    font-size: 14px;
    opacity: 0;
    transform: translate(-8px, 6px);
    transition: opacity 0.35s ease, transform 0.35s ease;
}

.new-industries-link:hover {
    color: #065ab9;
    transform: translateX(4px);
}

.new-industries-link:hover::before {
    transform: scaleX(0);
    transform-origin: right;
}

.new-industries-link:hover::after {
    opacity: 1;
    transform: translate(0, 0);
}
/* /fourth slider section css */
.new-research-section {
    font-family: "Product Sans", Arial, sans-serif;
    padding: 78px 20px 72px;
   
    color: #101548;
}

.new-research-wrap {
    max-width: 1260px;
    margin: 0 auto;
}

.new-research-head {
    max-width: 1200px;
    margin: 0 auto 36px;
    text-align: center;
}



.new-research-head p {
    margin: 0 auto;
    max-width: 1200px;
    font-size: 18px;
    line-height: 1.45;
    color: #050945;
}

.new-research-swiper {
    padding: 0 0 42px;
}

.new-research-grid {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr 0.85fr 1.15fr;
    grid-auto-rows: 326px;
    gap: 18px;
    padding: 20px;
}

.new-research-card {
    display: flex;
    overflow: hidden;
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(44, 50, 90, 0.08);
    transition: box-shadow 0.55s ease;
        border: 1px solid #eae2e2c4;
}

.new-research-card:hover {
    box-shadow: 0 18px 38px rgba(44, 50, 90, 0.16);
}

.new-research-img-wrap {
    flex: 0 0 34%;
    min-height: 100%;
    overflow: hidden;
}

.new-research-img {
    width: 100%;
    height: 100%;
    min-height: 100%;
    background-size: cover;
    background-position: center;
    transform: scale(1);
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.new-research-card:hover .new-research-img {
    transform: scale(1.1);
}

.industries-solution-img-wrap {
    flex: 0 0 34%;
    min-height: 100%;
    overflow: hidden;
}

.industries-solution-img {
    width: 100%;
    height: 100%;
    min-height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    transform: scale(1);
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.new-research-card:hover .industries-solution-img {
    transform: scale(1.1);
}

.new-research-card-small .industries-solution-img-wrap {
    flex: none;
    width: 100%;
    height: 185px;
    min-height: 185px;
}

.new-research-card-small {
    flex-direction: column;
}

.new-research-card-small .new-research-img-wrap {
    flex: none;
    width: 100%;
    height: 185px;
    min-height: 185px;
}

.new-research-card-wide,
.new-research-card-small {
    grid-column: span 2;
}

.new-research-img {
    flex: 0 0 34%;
    min-height: 100%;
    background-size: cover;
    background-position: center;
    transition: transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
    transform: scale(1);
}


.new-research-card:hover .new-research-img {
    transform: scale(1.08);
}
.new-research-content {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 40px 36px 20px;
}

.new-research-card-small .new-research-content {
    padding: 18px 16px 20px;
}



.new-research-card-small .new-research-content a {
    right: 16px;
    bottom: 15px;
}

.new-research-content span {
    width: max-content;
    margin-bottom: 14px;
    padding: 3px 7px;
    border-radius: 3px;
    background: #014088;
    color: #fff;
    font-size: 13px;
    line-height: 1;
    font-weight: 600;
}

.new-research-content h3 {
    margin: 0 0 12px;
    font-size: 22px;
    line-height: 1.25;
    font-weight: 500;
    color: #000000;
}

.new-research-card-small .new-research-content h3 {
    font-size: 19px;
}

.new-research-content small {
    margin-bottom: 8px;
    font-size: 15px;
    color: #444444;
}

.new-research-content p {
    margin: 0;
    font-size: 17px;
    line-height: 1.2;
    color: #444444;
}

.new-research-content a {
    position: relative;
    width: max-content;
    margin-top: auto;
    margin-left: auto;
    color: #000000;
    font-size: 15px;
    line-height: 1;
    text-decoration: none;
}

.new-research-content a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 100%;
    height: 1px;
    background: currentColor;
    transform: scaleX(1);
    transform-origin: left;
    transition: transform 0.45s ease;
}

@media (hover: hover) and (pointer: fine) and (min-width: 1025px) {
    .new-research-content a:hover::after {
        transform: scaleX(0);
        transform-origin: right;
    }
}
.sub-pages-img{
    display: flex;
    justify-content: center;
    align-items: center;
}
.new-research-img-1 {
    /* background:
        linear-gradient(135deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.35)),
        radial-gradient(circle at 20% 20%, #36ffb0, transparent 28%),
        linear-gradient(135deg, #020617 0%, #07164a 42%, #00c276 100%); */
       background: linear-gradient(135deg, #021b3d 0%, #064ea4 40%, #014088 70%, #3ea0ff 100%);
}
.saas-img img {
    height: 507px;
    margin-top: 19px;
}
.new-research-image-1 {
    background-image: url(/images/build-1.jpg);
    background-size: cover;
    background-position: center;
}
.new-research-image-2 {
    background-image: url(/images/scale.png);
    background-size: cover;
    background-position: center;
}
.new-research-image-3 {
    background-image: url(/images/transform.jfif);
    background-size: cover;
    background-position: center;
}
.new-research-image-4 {
    background-image: url(/images/specialization.webp);
    background-size: cover;
    background-position: center;
}

.new-research-img-2 {
    background:
        radial-gradient(circle at 20% 10%, rgba(255,255,255,0.45), transparent 22%),
        linear-gradient(135deg, #10233f 0%, #174b78 35%, #79e6ff 65%, #d8a35b 100%);
}

.new-research-img-3 {
    background:
        radial-gradient(circle at 80% 16%, #ff2a1f, transparent 20%),
        linear-gradient(135deg, #020617 0%, #151b2b 42%, #a31319 70%, #f7b46c 100%);
}

.new-research-img-4 {
    background:
        radial-gradient(circle at 68% 35%, #ffdd72, transparent 18%),
        linear-gradient(135deg, #7538ff 0%, #ff2ebd 36%, #ff934d 70%, #1511a8 100%);
}
.new-research-imgs-1{
    background-image:url(/images/new-folio-games.webp);
    background-repeat: no-repeat;
    background-size: cover;
}
.new-research-imgs-2{
    background-image:url(/images/new-kaycyber.webp);
    background-position: center bottom;
}
.new-research-imgs-3{
    background-image:url(/images/netrix-new.webp);
    
}
.new-research-imgs-4{
    background-image:url(/images/nw-guidalor.webp);
    background-position: center bottom;

}
.new-research-imgs-5{
    background-image:url(/images/v2a-new.webp);
    background-position: center bottom;

}
.new-research-imgs-6{
    background-image:url(/images/blacky-bg.webp);
    background-position: center bottom;

}
.new-research-imgs-7{
    background-image:url(/images/explanify-new.webp);
    background-position: center bottom;

}
.new-research-imgs-8{
    background-image:url(/images/skillscoop-new.webp);
    background-position: center bottom;

}

.new-research-pagination {
    bottom: 0 !important;
}

.new-research-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    background: #000000;
    opacity: 0.28;
    transition: 0.35s ease;
}

.new-research-pagination .swiper-pagination-bullet-active {
    width: 26px;
    border-radius: 20px;
    opacity: 1;
}
/* /next sec css */
.new-careers-section {
    font-family: "Product Sans", Arial, sans-serif;
    padding: 24px 20px;
    background: #014088;}

.new-careers-wrap {
    max-width: 1280px;
    min-height: 455px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 70px;
}

.new-careers-content {
    max-width: 620px;
    padding-left: 20px;
}

.new-careers-tag {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    margin-bottom: 14px;
    border-radius: 4px;
    background: #2a237c;
    color: #fff;
    font-size: 13px;
    line-height: 1;
    font-weight: 600;
}

.new-careers-content h2 {
    margin: 0 0 12px;
    font-size: 38px;
    line-height: 1.15;
    font-weight: 400;
    letter-spacing: -0.03em;
    color: #fff;
}

.new-careers-content p {
    margin: 0 0 24px;
    font-size: 16px;
    line-height: 1.45;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.92);
}

.new-careers-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-height: 39px;
    padding: 0 14px;
    border-radius: 6px;
    background: #fff;
    color: #242424;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    box-shadow: 0 16px 28px rgba(118, 97, 185, 0.28);
    transition: transform 0.55s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}

.new-careers-btn span {
    font-size: 14px;
    transition: transform 0.45s ease;
}

.new-careers-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 36px rgba(118, 97, 185, 0.38);
}

.new-careers-btn:hover span {
    transform: translate(3px, -3px);
}

.new-careers-image {
    height: 455px;
    border-radius: 22px;
    overflow: hidden;
}

.new-careers-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.new-careers-image:hover img {
    transform: scale(1.06);
}
/* industries section */
.industries-hero-section {
    font-family: "Product Sans", Arial, sans-serif;
    padding: 150px 20px 90px;
    background: #014088;
    text-align: center;
}

.industries-hero-wrap {
    max-width: 1200px;
    margin: 0 auto;
}

.industries-hero-badge {
    display: inline-flex;
    align-items: center;
    padding: 6px 18px;
    border-radius: 30px;
    background: #e7f1fc;
    color: #014088;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 22px;
}

.industries-hero-title {
    font-size: 50px;
    line-height: 1.25;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 20px;
}

.industries-hero-text {
    max-width: 1100px;
    margin: 0 auto 32px;
    font-size: 17px;
    line-height: 1.55;
    color: #f0f0f0;
}

.industries-hero-ratings {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px;
}

.industries-hero-rating-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(12, 24, 72, 0.08);
}

.industries-hero-stars {
    color: #ffb800;
    font-size: 11px;
    letter-spacing: 2px;
}

.industries-hero-brand {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #0c1848;
    font-size: 14px;
    font-weight: 600;
}

.industries-hero-brand i {
    font-size: 13px;
    color: #014088;
}
.industries-hero-rating-card img {
    height: 50px;
}
.industries-showcase-section {
    padding: 60px 20px 90px;
      
}
.latest_blog_section_resource .blogs_card img {
    width: 100%;
    object-fit: cover;
    height: 201px;
}
body.Resources .latest_blog_section_resource .blogs_card img {
    width: 100%;
    object-fit: cover;
    height: 273px;
}
section.common_sec.adv_technology.industry-blog {
    padding-top: 20px !important;
}
section.success-stories.indstry-stories {
    background: #f4f6fb;
    margin: 0px !important;
}
.industries-showcase-wrap {
    max-width: 1280px;
    margin: 0 auto;
    border-radius: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
      height: 800px;
    overflow: hidden;
    border: 4px solid #014088;
}



.industries-showcase-wrap img {
    max-width: 100%;
    width: 100%;
    height: auto;
    display: block;
    filter: drop-shadow(0 24px 50px rgba(0, 0, 0, 0.35));
    border-radius:10px;
    object-fit: cover;      /* fills container without distortion */
    object-position: center center; 
}

/* industries problem & solution */
.industries-solution-section {
    font-family: "Product Sans", Arial, sans-serif;
    padding: 60px 20px;
   background: #f4f6fb;
}

.industries-solution-wrap {
    max-width: 1200px;
    margin: 0 auto;
}

.industries-solution-head {
    text-align: center;
    max-width: 1200px;
    margin: 0 auto 50px;
}

.industries-solution-head h2 {
    font-size: 36px;
    line-height: 1.3;
    font-weight: 700;
    color: #0c1848;
    margin: 18px 0 16px;
}

.industries-solution-head p {
    font-size: 18px;
    line-height: 1.6;
    color: #5a5f73;
}

.industries-problem-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
    margin-bottom: 36px;
}

.industries-problem-card {
    position: relative;
    background: #fff;
    border: 1px solid #e8eaf0;
    border-radius: 18px;
    padding: 34px 28px;
    box-shadow: 0 14px 34px rgba(12, 24, 72, 0.06);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease, border-color 0.35s ease;
    overflow: hidden;
}

.industries-problem-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #0c1848 0%, #014088 55%, #2a7de1 100%);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s ease;
}

.industries-problem-card:hover {
    transform: translateY(-6px);
    border-color: transparent;
    box-shadow: 0 24px 46px rgba(1, 64, 136, 0.16);
}

.industries-problem-card:hover::before {
    transform: scaleX(1);
}

.industries-problem-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e7f1fc;
    color: #014088;
    font-size: 22px;
    margin-bottom: 20px;
}

.industries-problem-card h3 {
    font-size: 19px;
    font-weight: 700;
    color: #0c1848;
    margin: 0 0 10px;
}

.industries-problem-card p {
    font-size: 17px;
    line-height: 1.6;
    color: #5a5f73;
    margin: 0;
}

.industries-solution-banner {
    display: flex;
    /* align-items: center; */
    gap: 28px;
    padding: 40px 44px;
    border-radius: 22px;
    background:
        radial-gradient(circle at 12% 18%, rgba(255, 255, 255, 0.12), transparent 35%),
        linear-gradient(135deg, #0c1848 0%, #014088 55%, #2a7de1 100%);
    box-shadow: 0 26px 50px rgba(1, 64, 136, 0.28);
}

.industries-solution-banner-icon {
    flex-shrink: 0;
    width: 70px;
    height: 70px;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    font-size: 28px;
}

.industries-solution-banner-content {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.industries-solution-banner-content h3 {
    font-size: 21px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 8px;
}

.industries-solution-banner-content p {
    font-size: 17px;
    line-height: 1.6;
    color: #d9e6f7;
    margin: 0 0 14px;
}

.industries-solution-btn {
    align-self: flex-start;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
    padding: 14px 26px;
    border-radius: 30px;
    background: #fff;
    color: #014088;
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.industries-solution-btn:hover {
    /* transform: translateY(-3px); */
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
    color: #014088;
}

@media (max-width: 991px) {
    .industries-problem-grid {
        grid-template-columns: 1fr;
    }

    .industries-solution-banner {
        flex-direction: column;
        text-align: center;
        padding: 34px 26px;
    }

    .industries-solution-banner-content {
        align-items: center;
    }

    .industries-solution-btn {
        align-self: center;
        font-size: 14px;
        padding: 10px 20px;
    }
}

/* industries overview / problem statement */
.industries-overview-section {
    font-family: "Product Sans", Arial, sans-serif;
    padding: 70px 20px;
    background: #f4f6fb;
}

.industries-overview-wrap {
    max-width: 1200px;
    margin: 0 auto;
}

.industries-overview-head {
    margin-bottom: 26px;
}

.industries-overview-head h2 {
    font-size: 35px;
    font-weight: 700;
    color: #0c1848;
    margin: 0;
}

.industries-overview-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.industries-overview-card {
    background: #fff;
    border-radius: 18px;
    padding: 30px;
    box-shadow: 0 4px 18px rgba(12, 24, 72, 0.06);
}

.industries-overview-card-wide {
    grid-column: 1 / -1;
}

.industries-overview-icon {
    width: 46px;
    height: 46px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    margin-bottom: 18px;
}

.industries-overview-card-green .industries-overview-icon {
    background: #e6f4ea;
    color: #1f9254;
}

.industries-overview-card-blue .industries-overview-icon {
    background: #e7f1fc;
    color: #2654d6;
}

.industries-overview-card-purple .industries-overview-icon {
    background: #efeafc;
    color: #5a3fd6;
}

.industries-overview-card p {
    font-size: 18px;
    line-height: 1.65;
    color: #34384a;
    margin: 0;
}

/* ai mvp page css */
.aimvp-page {
    font-family: "Product Sans", Arial, sans-serif;
    background: #fff;
}

.aimvp-page h2,
.aimvp-page h3,
.aimvp-page h4 {
    font-family: "Product Sans", Arial, sans-serif;
    color: #000 !important;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.aimvp-page li {
    font-family: "Product Sans", Arial, sans-serif;
    color: #44506f;
}
.aimvp-page .heading_new h2 {
    font-size: clamp(28px, 3.2vw, 42px) !important;
    line-height: 1.15;
    letter-spacing: -0.03em;
}
.aimvp-page .heading_new.text-center p {
    color: #44506f !important;
    font-size: 18px !important;
    line-height: 1.7;
    max-width: 1200px;
    margin: 0 auto;
}
.aimvp-page .linee {
    height: 4px;
    width: 64px;
    border-radius: 4px;
    background: #014088;
    margin: 18px auto 26px auto;
}
.aimvp-page .common_sec {
    padding: 90px 0;
}
section.about_us_banner.portfolio_headarea.career_header.new-ui-ux {
    background: #014088 !important;
}
/* ---------- Banner (kept same structure, theme refreshed) ---------- */
.aimvp-page .web_app_header {
    background:
        radial-gradient(circle at top right, rgba(1, 64, 136, 0.08), transparent 32%),
        linear-gradient(180deg, #ffffff 0%, #f7faff 100%);
    padding: 145px 0 80px  !important;
}
.aimvp-page .web_app_header h1 {
    font-size: clamp(34px, 4.4vw, 57px) !important;
    letter-spacing: -0.04em;
    margin-bottom: 16px;
}
.aimvp-page .web_app_header > .container > aside > p:first-of-type {
    font-weight: 700;
    font-size: 19px;
}
.aimvp-page .web_app_header p {
    font-size: 17px;
    line-height: 1.75;
    color: #44506f;
}
.webapp_box_section .app_box {
    min-height: 570px !important;
}
/* ---------- AI MVP Stance cards ---------- */
.aimvp-page .webapp_box_section {
    background: #fff;
}
.aimvp-page .app_box {
    border-radius: 24px;
    box-shadow: 0 12px 30px rgba(6, 18, 47, 0.08);
    border: 1px solid rgba(1, 64, 136, 0.08);
    transition: transform 0.35s ease, box-shadow 0.35s ease, background-color 0.35s ease;
    background: #fff;
    padding: 36px 30px 0;
    height: 100%;
}
.aimvp-page .app_box:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(1, 64, 136, 0.18);
}
.aimvp-page .app_box .app_box_icon {
    width: 56px;
    height: 56px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: rgba(1, 64, 136, 0.08);
}
.aimvp-page .app_box .app_box_icon i {
    color: #014088;
    font-size: 22px;
}
.aimvp-page .app_box > p {
    font-size: 21px !important;
    font-weight: 700;
    color: #06122f;
    margin-bottom: 30px;
}
.aimvp-page .app_box ul li {
    font-size: 17px;
    line-height: 1.4;
    margin-bottom: 8px;
}

/* ---------- Technologies section (full redesign) ---------- */
.aimvp-page .aimvp-tech-section {
    background:
        radial-gradient(circle at top right, rgba(1, 64, 136, 0.07), transparent 35%),
        linear-gradient(180deg, #f7faff 0%, #ffffff 100%);
}
.aimvp-page .aimvp-tech-pills {
    display: flex !important;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 12px;
    margin: 0 0 20px;
    list-style: none !important;
    padding: 0;
    max-width: 100%;
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.aimvp-page .aimvp-tech-pills::-webkit-scrollbar {
    display: none;
}
.aimvp-page .aimvp-tech-pills > li {
    margin: 0;
    flex: 0 0 auto;
    width: auto !important;
    border: none !important;
    float: none !important;
}
.aimvp-page .aimvp-tech-pill {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    padding: 13px 26px !important;
    border-radius: 999px !important;
    background: #fff;
    border: 1px solid rgba(1, 64, 136, 0.14) !important;
    color: #014088;
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
    margin: 0 !important;
    transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.aimvp-page .aimvp-tech-pill::after {
    content: none !important;
}
.aimvp-page .aimvp-tech-pill:hover {
    border-color: rgba(1, 64, 136, 0.3);
    box-shadow: 0 10px 24px rgba(1, 64, 136, 0.12);
}
.aimvp-page li.active .aimvp-tech-pill,
.aimvp-page .aimvp-tech-pill.is-active {
    background: #014088 !important;
    border-color: #014088 !important;
    color: #fff !important;
    box-shadow: 0 14px 30px rgba(1, 64, 136, 0.25);
}
.aimvp-page .aimvp-tech-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 18px;
}
.aimvp-page .aimvp-tech-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 28px 14px;
    border-radius: 20px;
    background: #fff;
    border: 1px solid rgba(1, 64, 136, 0.08);
    box-shadow: 0 10px 26px rgba(6, 18, 47, 0.06);
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}
.aimvp-page .aimvp-tech-card:hover {
    transform: translateY(-6px);
    border: 1px solid #014088;
    box-shadow: 0 20px 44px rgba(1, 64, 136, 0.22);
}
.aimvp-page .aimvp-tech-card .aimvp-tech-icon {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    /* background: rgba(1, 64, 136, 0.06); */
    transition: background-color 0.3s ease;
}
.aimvp-page .aimvp-tech-card:hover .aimvp-tech-icon {
    /* background: rgba(255, 255, 255, 0.14); */
}
.aimvp-page .aimvp-tech-card .aimvp-tech-icon img {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.aimvp-page .aimvp-tech-card span {
    font-size: 14px;
    font-weight: 700;
    color: #06122f;
    transition: color 0.3s ease;
}
.aimvp-page .aimvp-tech-card:hover span {
    color: #014088;
}
.aimvp-page .ai-core-services {
    background: #fff;
}
.aimvp-page .ai-core-services .ai-core-intro {
    max-width: 720px;
    margin: 0 auto 6px;
}
.aimvp-page .ai-core-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
    margin-top: 50px;
}
.aimvp-page .ai-service-card {
    display: flex;
    flex-direction: column;
    background: rgb(1 64 136 / 8%);
    border-radius: 20px;
    border: 1px solid rgba(1, 64, 136, 0.08);
    box-shadow: 0 10px 26px rgba(6, 18, 47, 0.06);
    overflow: hidden;
    transition: box-shadow 0.3s ease, transform 0.3s ease, border-color 0.3s ease;
}
.aimvp-page .ai-service-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 44px rgba(1, 64, 136, 0.18);
    border-color: #014088;
    background: #fff;
}
/* .aimvp-page .ai-service-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 44px rgba(1, 64, 136, 0.18);
    border-color: #014088;
} */
.aimvp-page .ai-service-card:hover *{
    color: #014088 !important;
}
.aimvp-page .ai-service-card .ai-service-img {
    height: 150px;
    overflow: hidden;
}
.aimvp-page .ai-service-card .ai-service-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 0;
    transition: transform 0.4s ease;
}
.aimvp-page .ai-service-card:hover .ai-service-img img {
    transform: scale(1.06);
}
.aimvp-page .ai-service-card .ai-service-content {
    flex: 1;
    padding: 26px 24px 18px;
}
.aimvp-page .ai-service-card h3 {
    margin-top: 0;
    font-size: 20px !important;
    letter-spacing: -0.02em;
    margin-bottom: 10px;
    transition: color 0.3s ease;
}
.aimvp-page .ai-service-card p {
    font-size: 14.5px;
    line-height: 1.65;
    transition: color 0.3s ease;
}
.aimvp-page .ai-service-card:hover h3 {
    color: #014088;
}
.aimvp-page .ai-service-card:hover .ai-service-content p {
    color: #1a2436;
}
.aimvp-page .ai-service-card ul {
    margin: 16px 0 0;
    padding-left: 0;
    list-style: none;
}
.aimvp-page .ai-service-card ul li {
    position: relative;
    margin-bottom: 8px;
    padding-left: 22px;
    font-size: 13.5px;
    color: #44506f;
}
.aimvp-page .ai-service-card ul li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 7px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #014088;
}
.aimvp-page .ai-service-footer {
    margin-top: auto;
    padding: 14px 24px;
    background: rgba(1, 64, 136, 0.06);
    border-top: 1px solid rgba(1, 64, 136, 0.08);
}
.aimvp-page .ai-service-footer a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #014088;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.3s ease, gap 0.3s ease;
}
.aimvp-page .ai-service-footer a:hover {
    color: #0c5cbc;
    gap: 10px;
}

/* ai core services - expanding image cards */
.aimvp-page .ai-core-expand-section {
    background: #fff;
}
.aimvp-page .ai-core-expand-section .ai-core-intro {
    max-width: 720px;
    margin: 0 auto 6px;
}
.aimvp-page .ai-expand-grid {
    display: flex;
    align-items: stretch;
    gap: 14px;
    height: 620px;
    margin-top: 50px;
}
.aimvp-page .ai-expand-card {
    position: relative;
    flex: 1 1 0%;
    min-width: 0;
    overflow: hidden;
    border-radius: 16px;
    cursor: pointer;
    transition: flex 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.aimvp-page .ai-expand-card:hover,
.aimvp-page .ai-expand-card:focus-within {
    flex: 2.6 1 0%;
}
.aimvp-page .ai-expand-bg {
    position: absolute;
    inset: 0;
}
.aimvp-page .ai-expand-bg::after {
    content: "";
    position: absolute;
    inset: 0;
 
}
section.portfolio_headarea.career_header.web_app_header.space.new-industry-page {
    padding-bottom: 80px !important;
}
.aimvp-page .ai-expand-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.aimvp-page .ai-expand-arrow {
    position: absolute;
       top: 20px;
    right: 14px;
    z-index: 3;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.6);
    color: #fff;
    font-size: 13px;
    opacity: 0;
    transform: rotate(-45deg) translateY(-6px);
    transition: opacity 0.3s ease, transform 0.3s ease, background 0.3s ease, border-color 0.3s ease;
}
.aimvp-page .ai-expand-card:hover .ai-expand-arrow {
    opacity: 1;
    background: rgba(255, 255, 255, 0.15);
    border-color: #fff;
    transform: rotate(-45deg) translateY(0);
    transition: opacity 0.4s ease 0.2s, transform 0.4s ease 0.2s, background 0.3s ease, border-color 0.3s ease;
}

/* heading is pinned to the top independently of the paragraph so it never shifts as the card widens */
.aimvp-page .ai-expand-title {
    position: absolute;
    top: 24px;
    left: 24px;
    right: 40px;
    z-index: 2;
    margin: 0;
    color: #fff !important;
    font-size: 18px !important;
    line-height: 1.3;
    transition: font-size 0.5s ease;
}
.aimvp-page .ai-expand-card:hover .ai-expand-title {
    font-size: 26px !important;
    right: 24px;
}

.aimvp-page .ai-expand-text {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 24px;
    z-index: 2;
    color: #fff;
}
.aimvp-page .ai-expand-text p {
    margin: 0;
    opacity: 0;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.6;
    color: #fff;
    transform: translateY(12px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}
.aimvp-page .ai-expand-card:hover .ai-expand-text p {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.4s ease 0.2s, transform 0.4s ease 0.2s;
}

.aimvp-page .techno_tab .nav-tabs {
    display: flex !important;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 12px;
    border: none;
    padding: 0 0 40px !important;
    list-style: none !important;
    max-width: 100%;
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.aimvp-page .techno_tab .nav-tabs::-webkit-scrollbar {
    display: none;
}
.aimvp-page .techno_tab .nav-tabs > li {
    float: none !important;
    width: auto !important;
    border: none !important;
    flex: 0 0 auto;
}
.heading_new.text-center.industries-area {
    margin-top: 30px;
}

.aimvp-page .techno_tab .nav-tabs > li > a {
    display: inline-flex !important;
    align-items: center;
    border: 1px solid rgba(1, 64, 136, 0.14) !important;
    border-radius: 999px !important;
    background: #fff;
    color: #014088;
    font-weight: 700;
    font-size: 15px;
    white-space: nowrap;
    padding: 13px 28px !important;
    margin: 0 !important;
    transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}
.aimvp-page .techno_tab .nav-tabs > li > a::after {
    content: none !important;
}
.aimvp-page .techno_tab .nav-tabs > li.active > a,
.aimvp-page .techno_tab .nav-tabs > li.active > a:focus,
.aimvp-page .techno_tab .nav-tabs > li.active > a:hover,
.aimvp-page .techno_tab .nav-tabs > li > a:hover {
    background: #014088 !important;
    color: #fff !important;
    border-color: #014088 !important;
    box-shadow: 0 14px 30px rgba(1, 64, 136, 0.22);
}
.aimvp-page .bg_gray {
    background: linear-gradient(180deg, #f7faff 0%, #eef4ff 100%) !important;
}
.aimvp-page .our_techno .tab-content {
    background: #fff;
    border-radius: 24px;
    padding: 44px;
    box-shadow: 0 12px 30px rgba(6, 18, 47, 0.07);
    border: 1px solid rgba(1, 64, 136, 0.06);
}
.aimvp-page .our_techno .tab-content .row {
    display: flex;
    align-items: center;
    gap: 8px;
}
.aimvp-page .our_techno .tab_image {
    text-align: center;
}
.aimvp-page .our_techno .tab_image img {
    max-width: 100%;
    border-radius: 18px;
}
.aimvp-page .our_techno .tab_text h2 {
    font-size: 26px !important;
    margin-bottom: 14px;
}
.aimvp-page .our_techno .tab_text p {
    font-size: 15.5px;
    line-height: 1.75;
}
.aimvp-page .our_techno .tab_text ul {
    margin-top: 22px;
    display: flex;
    flex-wrap: wrap;
    gap: 0;
}
.aimvp-page .our_techno .tab-content .tab_text ul li {
    width: 50%;
    box-sizing: border-box;
}
.aimvp-page .our_techno .tab_text ul li p {
    font-size: 15px;
    font-weight: 700;
    color: #06122f;
}
.techno_tab ul.nav-tabs {
    padding: 2px 0;
    overflow: visible;
}
.aimvp-page #price.tab-pane .row {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 40px;
}
.aimvp-page #price.tab-pane .tab_image {
    flex: 1 1 42%;
    width: 42%;
    max-width: 42%;
    text-align: center;
}
.aimvp-page #price.tab-pane .tab_text {
    flex: 1 1 58%;
    width: 58%;
    max-width: 58%;
}
.choose-why-section-for-build-page h2, .choose-why-section-for-build-page p, .choose-why-section-for-build-page h3 {
    color: #fff !important;
}
.aimvp-page .orange_button {
    border-radius: 999px;
    font-family: "Product Sans", Arial, sans-serif;
}
.aimvp-page .our_techno .orange_button.roundd_button.btn_bigg,
.aimvp-page .aimvp-tech-section .orange_button.roundd_button.btn_bigg {
    background: #014088;
    border: 2px solid #014088;
    color: #fff;
    max-width: none;
    width: auto;
    padding: 16px 34px;
    border-radius: 999px;
    box-shadow: 0 14px 34px rgba(1, 64, 136, 0.22);
}
.aimvp-page .our_techno .orange_button.roundd_button.btn_bigg:hover,
.aimvp-page .aimvp-tech-section .orange_button.roundd_button.btn_bigg:hover {
    background: #0c5cbc;
    border-color: #0c5cbc;
    color: #fff;
    box-shadow: 0 18px 40px rgba(1, 64, 136, 0.28);
}
.build-cta__content h2, .build-cta__content p {
    color: #fff !important;
}
.updated-services-page a.services-card.new-logo {
    height: 347px !important;
}
.swiper.awards-swiper.swiper-initialized.swiper-horizontal.swiper-backface-hidden {
    padding: 20px 0 !important;
}
@media (max-width: 1024px) {
.industries-showcase-wrap {
        padding: 0px;
        border-radius: 18px;
        height: auto;
    }
}

@media (max-width: 991px) {
    .aimvp-page .aimvp-tech-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .aimvp-page .aimvp-tech-pill {
        padding: 11px 18px;
        font-size: 14px;
    }

    .aimvp-page .ai-core-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .aimvp-page .our_techno .tab-content {
        padding: 30px;
    }

    .aimvp-page .aimvp-tech-pills {
        justify-content: flex-start;
    }
    .aimvp-page .techno_tab .nav-tabs{
        justify-content: center;
    }
}

@media (max-width: 600px) {
    .aimvp-page .aimvp-tech-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .aimvp-page .ai-core-grid {
        grid-template-columns: 1fr;
    }

    .aimvp-page .techno_tab .nav-tabs > li > a {
        padding: 11px 18px !important;
        font-size: 14px;
    }
    .aimvp-page .techno_tab .nav-tabs{
        justify-content: flex-start;
    }
}

@media (max-width: 767px) {
    .aimvp-page .our_techno .tab-content .row {
        flex-direction: column;
    }

    .aimvp-page .our_techno .tab-content .tab_text ul li {
        width: 100%;
    }

    .aimvp-page #price.tab-pane .row {
        flex-direction: column;
        flex-wrap: wrap;
        gap: 24px;
    }

    .aimvp-page #price.tab-pane .tab_image,
    .aimvp-page #price.tab-pane .tab_text {
        width: 100%;
        max-width: 100%;
        flex: 1 1 100%;
    }

    .aimvp-page .common_sec {
        padding: 56px 0;
    }

    .aimvp-page .ai-expand-grid {
        flex-direction: column;
        height: auto;
        gap: 16px;
    }

    .aimvp-page .ai-expand-card,
    .aimvp-page .ai-expand-card:hover {
        flex: none;
        width: 100%;
        /* height: 240px; */
    }

    .aimvp-page .ai-expand-title,
    .aimvp-page .ai-expand-card:hover .ai-expand-title {
        font-size: 22px !important;
    }

    .aimvp-page .ai-expand-text p,
    .aimvp-page .ai-expand-card .ai-expand-text p,
    .aimvp-page .ai-expand-card:hover .ai-expand-text p {
        opacity: 1;
        transform: translateY(0);
        font-size: 16px;
    }

    .aimvp-page .ai-expand-arrow,
    .aimvp-page .ai-expand-card:hover .ai-expand-arrow {
        opacity: 1;
        transform: rotate(-45deg) translateY(0);
    }
}

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

    .industries-overview-card-wide {
        grid-column: auto;
    }
    .aimvp-page .ai-expand-text p,
    .aimvp-page .ai-expand-card .ai-expand-text p,
    .aimvp-page .ai-expand-card:hover .ai-expand-text p {
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 6;
        line-clamp: 6; 
        -webkit-box-orient: vertical;
    }
}

@media (max-width:1440px)
{
    .new-landing-page .container{
  max-width: 100% !important;
  width: auto !important;
}
}

/* CTA banner should stay inset from the viewport edges at every width,
   not stretch full-bleed like the generic .new-landing-page .container rule above. */
.new-landing-page .get-in-touch-area .container {
    max-width: 1200px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* responsive css */
@media (max-width: 1199px) {
    .new-hero-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 28px;
    }

    .new-hero-card {
        min-height: 260px;
    }
}

@media (max-width: 991px) {
    .new-industries-section {
        padding: 70px 20px 55px;
    }

    .new-industries-head {
        margin-bottom: 50px;
    }

    .new-industries-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 42px 70px;
    }
     .new-research-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: none;
    }

    .new-research-card {
        grid-column: span 1;
        flex-direction: column;
        min-height: 260px;
    }

    .new-research-content p {
        display: none;
    }
    .new-research-industry .new-research-content p{
        display: block !important;
    }
    .new-research-content,
    .new-research-card-small .new-research-content {
        padding: 20px 18px 18px;
    }

    .new-research-content h3,
    .new-research-card-small .new-research-content h3 {
        font-size: 19px;
    }

    .new-research-card-small .new-research-content a {
        position: relative;
        right: auto;
        bottom: auto;
    }

   .new-research-img-wrap,
    .new-research-card-small .new-research-img-wrap,
    .industries-solution-img-wrap,
    .new-research-card-small .industries-solution-img-wrap {
        flex: none;
        width: 100%;
        height: 170px;
        min-height: 170px;
    }
     .new-careers-wrap {
        grid-template-columns: 1fr;
        gap: 34px;
        min-height: auto;
        padding: 50px 0;
    }

    .new-careers-content {
        padding-left: 0;
        max-width: 100%;
    }

    .new-careers-image {
        height: 380px;
    }
}

@media (max-width: 768px) {
.industries-solution-section {
    padding: 40px 20px;
}
.industries-overview-section {
    padding: 50px 20px;
}
.new-research-section {
    padding: 50px 16px 50px;
}
.industries-problem-grid {
    margin-bottom: 0;
}
}

@media (max-width: 767px) {
    .new-hero-section {
        padding: 34px 16px 46px;
    }

    .new-hero-head {
        margin-bottom: 42px;
    }

    .new-hero-head h2 {
        font-size: 25px;
    }

    .new-hero-grid {
        grid-template-columns: 1fr;
        gap: 26px;
    }

    .new-hero-visual {
        height: 185px;
    }

    .new-hero-visual h3 {
        font-size: 28px;
    }

    .new-hero-content {
        width: calc(100% - 28px);
        min-height: 185px;
        margin-top: -36px;
    }

    .new-hero-card {
        min-height: 340px;
    }
}
@media (max-width: 575px) {
     .new-research-content {
        padding: 22px 18px 24px;
    }
    .new-industries-section {
        padding: 56px 16px 46px;
    }

    .new-industries-head h2 {
        font-size: 25px;
    }

    .new-industries-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .new-industries-col {
        gap: 26px;
    }

    .new-research-head h2 {
        font-size: 25px;
    }

    .new-research-grid {
        grid-template-columns: 1fr;
        gap: 18px;
        padding: 0 0 0px;
    }

    .new-research-card {
        min-height: 300px;
    }

    .new-research-content {
        padding: 22px 18px 18px;
    }

    .new-research-content h3,
    .new-research-card-small .new-research-content h3 {
        font-size: 18px;
    }
     .new-careers-section {
        padding: 18px 16px;
    }

    .new-careers-wrap {
        padding: 42px 0;
    }

    .new-careers-content h2 {
        font-size: 30px;
    }

    .new-careers-image {
        height: 300px;
        border-radius: 18px;
    }
    .new-industries-col {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
        flex-direction: column;
}

/* ============================================================
   FAQ Section — nh-faq-* (scoped, no conflicts)
   ============================================================ */
.nh-faq-section {
    padding: 80px 0;
    background: #fff;
    font-family: "Product Sans", Arial, sans-serif;
}

.nh-faq-wrap {
    max-width: 860px;
    margin: 0 auto;
    padding: 0 20px;
}

.nh-faq-heading {
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 300;
    color: #0c1848;
    margin: 0 0 52px;
    letter-spacing: -0.02em;
    line-height: 1.15;
}

.nh-faq-list {
    display: flex;
    flex-direction: column;
}

/* Each row */
.nh-faq-item {
    border-bottom: 1px solid #e8eaf0;
}

.nh-faq-item:first-child {
    border-top: 1px solid #e8eaf0;
}

/* Trigger button — reset all inherited button styles first */
.nh-faq-trigger {
    width: 100%;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 0;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none;
    cursor: pointer;
    text-align: left;
    font-family: "Product Sans", Arial, sans-serif;
    -webkit-appearance: none;
    appearance: none;
}

.nh-faq-q {
    font-size: 16px;
    font-weight: 500;
    color: #0c1848;
    line-height: 1.5;
    flex: 1;
    transition: color 0.2s ease;
}

.nh-faq-trigger[aria-expanded="true"] .nh-faq-q {
    color: #014088;
}

/* +/- icon */
.nh-faq-icon {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border-radius: 50% !important;
    border: 1.5px solid #c8cde0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: relative;
    background: transparent;
    transition: background 0.25s ease, border-color 0.25s ease;
}

.nh-faq-icon::before,
.nh-faq-icon::after {
    content: '';
    position: absolute;
    background: #0c1848;
    border-radius: 2px;
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                opacity 0.3s ease,
                background 0.25s ease;
}

/* horizontal bar */
.nh-faq-icon::before {
    width: 13px;
    height: 1.5px;
}

/* vertical bar */
.nh-faq-icon::after {
    width: 1.5px;
    height: 13px;
}

/* expanded state — hide vertical bar, turn icon blue */
.nh-faq-trigger[aria-expanded="true"] .nh-faq-icon {
    background: #014088;
    border-color: #014088;
}

.nh-faq-trigger[aria-expanded="true"] .nh-faq-icon::before,
.nh-faq-trigger[aria-expanded="true"] .nh-faq-icon::after {
    background: #fff;
}

.nh-faq-trigger[aria-expanded="true"] .nh-faq-icon::after {
    transform: scaleY(0);
    opacity: 0;
}

/* Smooth body — CSS grid trick */
.nh-faq-body {
    display: grid !important;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.38s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.nh-faq-body.is-open {
    grid-template-rows: 1fr;
}

.nh-faq-content {
    overflow: hidden;
    min-height: 0; /* required — without this, 0fr does not collapse the row */
}

.nh-faq-content p {
    margin: 0 0 14px;
    font-size: 15px;
    color: #4a5278;
    line-height: 1.75;
}

.nh-faq-content p:last-child {
    margin-bottom: 24px;
}

.nh-faq-ul {
    margin: 10px 0 14px 0;
    padding-left: 20px;
    list-style: disc;
}

.nh-faq-ul li {
    font-size: 15px;
    color: #4a5278;
    line-height: 1.7;
    margin-bottom: 6px;
}

/* Mobile */
@media (max-width: 640px) {
    .nh-faq-section {
        padding: 52px 0;
    }

    .nh-faq-heading {
        margin-bottom: 32px;
    }

    .nh-faq-q {
        font-size: 14.5px;
    }

    .nh-faq-trigger {
        padding: 18px 0;
    }
}
.new-hero-head h1 {
    font-size: 29px;
    margin-bottom: 30px;
}
section.new-hero-section {
    padding-top: 23px;
}
.aimvp-page .ai-expand-card {
    height: 270px;
}
}


@media (max-width: 767px) {
    .industries-hero-section {
        padding: 120px 16px 44px;
    }

    .industries-hero-title {
        font-size: 28px;
    }

    .industries-hero-text {
        font-size: 15px;
    }

    .industries-hero-ratings {
        gap: 10px;
    }

    .industries-hero-rating-card {
        padding: 8px 14px;
    }
}

@media (max-width: 768px) {
   
}

@media (max-width: 767px) {
    .industries-showcase-section {
        padding: 40px 16px 40px;
    }
}
/* ============================================================
   Latest Insights cards — equal-height rows (industries.php)
   ============================================================ */
#posts-container.resources-section {
    display: flex;
    flex-wrap: wrap;
}

#posts-container.resources-section > div {
    display: flex;
}

#posts-container.resources-section .blogs_card {
    display: flex;
    flex-direction: column;
    width: 100%;
}

#posts-container.resources-section .blog_content {
    flex: 1 0 auto;
}
/* Build/scale/transform pages + their service detail pages - container width override */
body.build-page .container,
body.Specialization-page .container,
body.scale-page .container,
body.transform-page .container,
body.ai-mvp-development .container,
body.saas-product-development .container,
body.offshore-development-center .container,
body.managed-engineering .container,
body.hire-devops-developer .container,
body.ai-consulting .container,
body.ai-agent-development .container,
body.process-automation .container,
body.cloud-migration .container,body.Fintech.Development.Company .container,body.Real.Estate.App.Development.Company.\|.PropTech.AI .container,
body.Automotive.Software.Development.Company.\|.AI.Mobility .container,.main_boxx .container {
    max-width: 1440px !important;
    width: 100% !important;
}
@media (max-width: 1440px) {
    body.build-page .container,
    body.scale-page .container,
    body.transform-page .container,
    body.ai-mvp-development .container,
    body.saas-product-development .container,
    body.offshore-development-center .container,
    body.managed-engineering .container,
    body.hire-devops-developer .container,
    body.ai-consulting .container,
    body.ai-agent-development .container,
    body.process-automation .container,
    body.cloud-migration .container {
        max-width: 1280px !important;
        width: 100% !important;
    }
}

/* Certification badges: build/scale/transform/specialization internal pages only */
body.ai-consulting .certification-badge,
body.process-automation .certification-badge,
body.cloud-migration .certification-badge,
body.ai-agent-development .certification-badge,
body.hire-devops-developer .certification-badge,
body.offshore-development-center .certification-badge,
body.managed-engineering .certification-badge,
body.saas-product-development .certification-badge,
body.ai-mvp-development .certification-badge {
    width: 200px;
}

body.ai-consulting .certification-badge img,
body.process-automation .certification-badge img,
body.cloud-migration .certification-badge img,
body.ai-agent-development .certification-badge img,
body.hire-devops-developer .certification-badge img,
body.offshore-development-center .certification-badge img,
body.managed-engineering .certification-badge img,
body.saas-product-development .certification-badge img,
body.ai-mvp-development .certification-badge img {
    width: 200px;
    max-width: 200px;
}

/* Certification badges: build/scale/transform/specialization internal pages only */
body.ai-consulting .certification-badge,
body.process-automation .certification-badge,
body.cloud-migration .certification-badge,
body.ai-agent-development .certification-badge,
body.hire-devops-developer .certification-badge,
body.offshore-development-center .certification-badge,
body.managed-engineering .certification-badge,
body.saas-product-development .certification-badge,
body.ai-mvp-development .certification-badge {
    width: 200px;
}

body.ai-consulting .certification-badge img,
body.process-automation .certification-badge img,
body.cloud-migration .certification-badge img,
body.ai-agent-development .certification-badge img,
body.hire-devops-developer .certification-badge img,
body.offshore-development-center .certification-badge img,
body.managed-engineering .certification-badge img,
body.saas-product-development .certification-badge img,
body.ai-mvp-development .certification-badge img {
    width: 200px;
    max-width: 200px;
}

.aimvp-page .web_app_header .container {
    display: flex;
    align-items: center;
}
.portfolio_headarea img {
    object-fit: contain;
}
div#myModal {
    z-index: 9999;
}
form#estimate-form .form-group .iti__flag-container {
    height: 47px;
}

/* mvp new page css */
.mvpflow-section {
    padding: 90px 0;
    overflow: hidden;
    background: #2b8eff0f;
}
.process_bottom_bar a {
    color: #fff;
}
.process_bottom_bar a:hover {
    color: #fff;
}
.mvpflow-heading {
    max-width: 850px;
    margin-bottom: 48px;
}

.mvpflow-eyebrow {
    display: block;
    margin-bottom: 8px;
    color: #014088;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 5px;
    line-height: 1.4;
}

.mvpflow-heading h2 {
    margin: 0;
    color: #09090b;
    font-size: clamp(34px, 4vw, 54px);
    font-weight: 800;
    letter-spacing: -1.8px;
    line-height: 1.08;
}

.mvpflow-heading p {
   
    margin: 20px 0 0;
    color: #525168;
    font-size: 17px;
    line-height: 1.75;
}

.mvpflow-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 24px;
}

.mvpflow-card {
    position: relative;
    grid-column: span 2;
    min-width: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(35, 24, 82, 0.08);
    box-shadow: 0 14px 45px rgba(57, 40, 105, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.mvpflow-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 22px 55px rgba(57, 40, 105, 0.15);
}

.mvpflow-visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 215px;
    margin: 18px 18px 0;
    overflow: hidden;
}
section#our-services h3 {
    max-width: 330px !important;
}

/* mvp-development.astro service cards */
.mvp-visual-one {
    background-image: url(/images/product-discovery.webp);
}

.mvp-visual-two {
    background-image: url(/images/mvp-dev.webp);
}

.mvp-visual-three {
    background-image: url(/images/cto-services.webp);
}

.mvp-visual-four {
    background-image: url(/images/product-launch.webp);
}

.mvp-visual-five {
    background-image: url(/images/growth-and-support.webp);
}

/* ai-development-services.astro service cards */
.ai-visual-one {
    background-image: url(/images/ai-service-1.webp);
}

.ai-visual-two {
    background-image: url(/images/ai-service-2.webp);
}

.ai-visual-three {
    background-image: url(/images/mvp-dev.webp);
}

.ai-visual-four {
    background-image: url(/images/ai-service-4.webp);
}

.ai-visual-five {
    background-image: url(/images/ai-service-5.webp);
}

.ai-visual-six {
    background-image: url(/images/ai-service-6.webp);
}

.ai-visual-seven {
    background-image: url(/images/blockchain-services-14.webp);
}
.ai-visual-eight {
    background-image: url(/images/ai-service-8.webp);
}
.ai-visual-nine {
    background-image: url(/images/web-mobile-applications.webp);
}
.ai-visual-ten {
    background-image: url(/images/ai-service-10.webp);
}
.ai-visual-eleven {
    background-image: url(/images/ai-service-11.webp);
}

/* blockchain-development-company.astro service cards */
.blockchain-visual-one {
    background-image: url(/images/blockchain-services-1.webp);
}

.blockchain-visual-two {
    background-image: url('/images/blockchain-services-2.webp');
}

.blockchain-visual-three {
    background-image: url(/images/blockchain-services-3.webp);
}

.blockchain-visual-four {
    background-image: url(/images/blockchain-services-4.webp);
}

.blockchain-visual-five {
    background-image: url(/images/blockchain-services-5.webp);
}

.blockchain-visual-six {
    background-image: url(/images/blockchain-services-6.webp);
}

.blockchain-visual-seven {
    background-image: url(/images/blockchain-services-7.webp);
}

.blockchain-visual-eight {
    background-image: url(/images/blockchain-services-8.webp);
}

.blockchain-visual-nine {
    background-image: url(/images/blockchain-services-9.webp);
}

.blockchain-visual-ten {
    background-image: url(/images/web-mobile-applications.webp);
}

.blockchain-visual-eleven {
    background-image: url(/images/blockchain-services-5.webp);
}

.blockchain-visual-twelve {
    background-image: url(/images/mvp-dev.webp);
}
.blockchain-visual-thirteen {
    background-image: url(/images/blockchain-services-13.webp);
}
.blockchain-visual-fourteen {
    background-image: url(/images/blockchain-services-14.webp);
}
.blockchain-visual-fifteen {
    background-image: url(/images/blockchain-services-15.webp);
}

.custom-visual-one{
    background-image: url(/images/enterprise-software-development.webp);
}
.custom-visual-two{
    background-image: url(/images/saas-product-development.webp);
}
.custom-visual-three{
    background-image: url(/images/web-mobile-applications.webp);
}
.custom-visual-four{
    background-image: url(/images/ai-powered-solutions.webp);
}
.custom-visual-five{
    background-image: url(/images/business-process-automation-service.webp);
}
.custom-visual-six{
    background-image: url(/images/system-integration.webp);
}
.custom-visual-seven{
    background-image: url(/images/legacy-software-modernization.webp);
}
.custom-visual-eight
{
    background-image: url(/images/suuport-and-maintenance.webp);
}
.service-visual-blockchain {
    background-image: url(/images/blockchain-dev-services.webp);
}
.service-visual-ai {
    background-image: url(/images/ai-dev-solution.webp);
}
.service-visual-custom {
    background-image: url(/images/custom-software-dev.webp);
}
.service-visual-digital {
    background-image: url(/images/digital-product-development.webp);
}
.service-visual-webmobile {
    background-image: url(/images/bescope-mob-and-web.webp);
}
.service-visual-professional {
    background-image: url(/images/professional-services.webp);
}
.launchready-visual-one {
    background-image: url(/images/launch-ready-services-1.webp);
}
.launchready-visual-two {
    background-image: url(/images/launch-ready-services-2.webp);
}
.launchready-visual-three {
    background-image: url(/images/launch-ready-services-3.webp);
}
.launchready-visual-four {
    background-image: url(/images/launch-ready-services-4.webp);
}
.launchready-visual-five {
    background-image: url(/images/launch-ready-services-5.webp);
}
.launchready-visual-six {
    background-image: url(/images/launch-ready-services-6.webp);
}
.launchready-visual-seven {
    background-image: url(/images/launch-ready-services-7.webp);
}
.launchready-visual-eight {
    background-image: url(/images/launch-ready-services-8.webp);
}
.launchready-visual-nine {
    background-image: url(/images/ai-service-4.webp);
}
.launchready-visual-ten {
    background-image: url(/images/launch-ready-services-10.webp);
}
.webapp-visual-one {
    background-image: url(/images/e-commerce-service.webp);
}
.webapp-visual-two {
    background-image: url(/images/enterprise-software-development.webp);
}
.webapp-visual-three {
    background-image: url(/images/web-mobile-applications.webp)
}
.webapp-visual-four {
    background-image: url(/images/system-integration.webp);
}
.webapp-visual-five {
    background-image: url(/images/ai-powered-solutions.webp);
}
.build-hero__inner.service-hero h1 {
    max-width: 1100px;
}
.build-hero__inner.service-hero {
    max-width: 1200px !important;
}
/* 6-card variant (services/index.astro): the base .mvpflow-grid
   nth-child(4)/(5) rules center a trailing pair of cards, which is
   correct for the 5-card layout but wraps a clean 3+3 grid of 6 cards
   into a lopsided 3-2-1 stack. Reset those two cards back to a normal
   2-column span so all 6 cards fill two even rows. */
.mvpflow-grid--six .mvpflow-card:nth-child(4),
.mvpflow-grid--six .mvpflow-card:nth-child(5) {
    grid-column: span 2;
}

/* Bootstrap-grid variant of the services cards (ai-development-services,
   blockchain-development-company, custom-software-development,
   mvp-development): column widths/wrapping come from Bootstrap's
   col-lg-4/col-sm-6/col-xs-12 classes, this just restores the equal-height
   cards and row gap that CSS grid gave the .mvpflow-grid variant for free. */
.mvpflow-row {
    display: flex;
    flex-wrap: wrap;
}

.mvpflow-row > .mvpflow-col {
    display: flex;
    margin-bottom: 24px;
}

.mvpflow-row .mvpflow-card {
    width: 100%;
}

.mvpflow-content {
    position: relative;
    padding: 30px 30px 24px;
}

.mvpflow-content > p {
    min-height: 55px;
    margin: 0 0 5px;
    color: #55536a;
    font-size: 17px;
    line-height: 1.4;
}

.mvpflow-content ul {
    display: flex;
    flex-direction: column;
    gap: 13px;
    margin: 0;
    padding: 21px 0 0;
    border-top: 1px solid #ece9f4;
    list-style: none;
}

.mvpflow-content li {
    position: relative;
    padding-left: 23px;
    color: #333145;
    font-size: 14px;
    line-height: 1.55;
}

.mvpflow-content li::before {
    position: absolute;
    top: 7px;
    left: 0;
    width: 8px;
    height: 8px;
    content: "";
    background: #014088;
    border-radius: 2px;
    transform: rotate(45deg);
}
.process_simple_sec {
    position: relative;
    padding: 80px 0 0;
    background: #fff;
    overflow: hidden;
}

.process_simple_sec .container {
    max-width: 1320px;
    margin: auto;
    padding: 0 20px;
}

/* Header */
.process_simple_head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;
}

.process_simple_head > div:first-child {
    flex: 1;
}

.process_simple_head h2 {
    margin: 0 0 25px;
    color: #080808;
    font-size: 52px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1.5px;
}

.process_simple_head p {
    margin: 0;
    color: #252525;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.65;
}

/* Image */
.process_simple_img {
    width: 48%;
    height: 270px;
    overflow: hidden;
    clip-path: polygon(8% 0,100% 0,94% 100%,0 100%);
}

.process_simple_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* Steps */
.process_simple_steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 45px;
    margin-top: 65px;
}

.process_step {
    position: relative;
}

.process_step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 25px;
    left: 57px;
    width: calc(100% - 20px);
    border-top: 2px dashed #014088;
}


/* Icon */
.process_icon {
    position: relative;
    z-index: 2;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
    border-radius: 50%;
    border: 1px solid #014088;
    background: #fff;
    color: #014088;
    font-size: 22px;
}


/* Content */
.process_step h3 {
    margin: 0 0 12px;
    color: #090909;
    font-size: 25px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -.3px;
}

.process_step p {
    max-width: 370px;
    margin: 0;
    color: #333;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.65;
}


/* Bottom CTA */
.process_bottom_bar {
    position: relative;
    margin-top: 70px;
    margin-left: auto;
    width: 52%;
    padding: 30px 40px;
    background: #014088;
    color: #ffffff;
    font-size: 24px;
    text-align: center;
    transform: skew(-12deg);
}

.process_bottom_bar strong {
    font-weight: 800;
}

.process_bottom_bar>* {
    transform: skew(12deg);
}

.devtrust_section {
    padding: 80px 0;
    background: #f5f4f1;
}

.devtrust_section .container {
    max-width: 1440px;
    width: 100%;
    margin:auto;
    padding:0 20px;
    box-sizing: border-box;
}

.devtrust_wrapper {
    display:flex;
    align-items:center;
    gap:80px;
}


/* Left Team */

.devtrust_team {
    width:50%;
}

.devtrust_grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    background:#fff;
}


.devtrust_card {
    display:flex;
    align-items:center;
    gap:16px;
    padding:20px;
    border-bottom:1px solid #e8e8e8;
}

.devtrust_card:nth-child(odd) {
    border-right:1px solid #e8e8e8;
}


.devtrust_card img {
    width:95px;
    height:95px;
    object-fit:cover;
    border-radius:7px;
    background:#dce6f3;
}


.devtrust_card h4 {

    color:#090909;
    font-size:18px;
    font-weight:800;
}

.devtrust_card span {
    display:block;
    color:#333;
    font-size:14px;
}


.devtrust_card strong {
    display:block;
    color:#14265c;
    font-size:16px;
    line-height:1.3;
}


.devtrust_card small {
    display:block;
    color:#14265c;
    font-size:14px;
}


.devtrust_total {
    background:#fff;
    margin-top:12px;
    padding:18px;
    text-align:center;
    color:#111;
    font-size:18px;
    font-weight:700;
}


/* Right Content */

.devtrust_content {
    width:50%;
}


.devtrust_content label {
    display:block;
    margin-bottom:10px;
    color:#111;
    font-size:16px;
    letter-spacing:5px;
}


.devtrust_content h2 {
    margin:0 0 25px;
    color:#080808;
    font-size:48px;
    line-height:1.15;
    font-weight:800;
    letter-spacing:-1px;
}


.devtrust_content p {
    max-width:560px;
    margin:0;
    color:#333;
    font-size:18px;
    line-height:1.75;
}
.startup_fail_sec {
    padding:80px 0;
}

.startup_fail_head {
    text-align:center;
    margin:auto;
}

.startup_fail_head span {
    font-size:14px;
    letter-spacing:5px;
    color:#014088;
    font-weight:700;
}

.startup_fail_head h2 {
    margin:15px 0 50px;
    font-size:46px;
    line-height:1.2;
    font-weight:800;
    color:#080808;
}


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


.startup_fail_item {
    background:#fff;
    padding:25px 10px;
    border-radius:12px;
    font-size:17px;
    font-weight:600;
    color:#222;
    border:1px solid #eee;
    transition:.3s;
}


.startup_fail_item:hover {
    transform:translateY(-5px);
    box-shadow:0 15px 30px rgba(0,0,0,.08);
}
section.startup_fail_sec .container {
    max-width: 1440px;
    width: 100%;
    box-sizing: border-box;
}

@media(max-width:900px){

    .startup_fail_grid {
        grid-template-columns:repeat(2,1fr);
    }

}


@media(max-width:600px){

    .startup_fail_head h2 {
        font-size:32px;
    }

    .startup_fail_grid {
        grid-template-columns:1fr;
    }
    .is-scrolled .new-header__logo-img {
    height: 32px;
    width: auto;
    object-fit: contain;
}

}

/* ============================================================
   MVP page — feedback / video testimonial / agency intro / CTA form
   ============================================================ */

/* We Value Your Feedback */
.testi-feedback-sec {
    padding: 80px 0;
    background: #f5f8fc;
}

.testi-feedback-grid {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 40px;
    align-items: center;
}

.testi-feedback-head h2 {
    margin: 0 0 16px;
    color: #06122f;
    font-size: 62px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1px;
}

.testi-feedback-head p {
    max-width: 380px;
    margin: 0;
    color: #4a5568;
    font-size: 18px;
    line-height: 1.7;
}

.testi-feedback-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.testi-feedback-card {
    background: #fff;
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 12px 30px rgba(1, 64, 136, 0.08);
    transition: transform .3s ease, box-shadow .3s ease;
}

.testi-feedback-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(1, 64, 136, 0.14);
}

.testi-feedback-stars {
    color: #014088;
    letter-spacing: 3px;
    font-size: 16px;
    margin-bottom: 14px;
}

.testi-feedback-quote {
    margin: 0 0 22px;
    color: #1a1a1a;
    font-size: 16px;
    line-height: 1.65;
}

.testi-feedback-person {
    display: flex;
    align-items: center;
    gap: 12px;
}

.testi-feedback-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.testi-feedback-meta {
    display: flex;
    flex-direction: column;
}

.testi-feedback-name {
    color: #06122f;
    font-size: 15px;
    font-weight: 700;
}

.testi-feedback-role {
    color: #64748b;
    font-size: 13px;
}

/* Hear What Our Clients Say — video testimonial */
.testi-video-sec {
    padding: 80px 0;
    background: #fff;
}

.testi-video-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.testi-video-media {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    background: #014088;
}

.testi-video-media img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
    opacity: .85;
}

.testi-video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 68px;
    height: 68px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.92);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 10px 30px rgba(1, 64, 136, 0.35);
    transition: transform .25s ease;
}

.testi-video-play:hover {
    transform: translate(-50%, -50%) scale(1.06);
}

.testi-video-play-icon {
    width: 0;
    height: 0;
    margin-left: 4px;
    border-style: solid;
    border-width: 12px 0 12px 20px;
    border-color: transparent transparent transparent #014088;
}

.testi-video-kicker {
    display: block;
    color: #014088;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 3px;
    margin-bottom: 10px;
}

.testi-video-content h2 {
    margin: 0 0 20px;
    color: #06122f;
    font-size: 38px;
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1.15;
}

.testi-video-quote {
    margin: 0 0 22px;
    padding: 0;
    border: none;
    color: #1a1a1a;
    font-size: 22px;
    font-weight: 500;
    line-height: 1.5;
}

.testi-video-person {
    display: flex;
    flex-direction: column;
}

.testi-video-name {
    color: #06122f;
    font-size: 16px;
    font-weight: 700;
}

.testi-video-role {
    color: #64748b;
    font-size: 14px;
}

/* Full-service IT agency intro */
.agency-intro-sec {
    padding: 80px 0;
    background: #f5f8fc;
}

.agency-intro-top {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-bottom: 36px;
}

.agency-intro-top h2 {
    margin: 0;
    color: #06122f;
    font-size: 36px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
}

.agency-intro-text p {
    margin: 0 0 14px;
    color: #4a5568;
    font-size: 17px;
    line-height: 1.7;
}

.agency-intro-link {
    color: #014088;
    font-size: 16px;
    font-weight: 700;
    text-decoration: underline;
}

.agency-intro-media {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
}

.agency-intro-media img {
    width: 100%;
    max-height: 460px;
    object-fit: cover;
    display: block;
}

.agency-intro-badge {
    position: absolute;
    left: 0;
    bottom: 0;
    display: flex;
    align-items: baseline;
    gap: 10px;
    background: #bcdafc;
    padding: 18px 26px;
}
.agency-intro-badge img {
   
    height: 40px;
}

.agency-intro-badge-stars {
    color: #ff2121;
    letter-spacing: 2px;
    font-size: 20px;
}

/* Ready to Build Software? CTA + enquiry form */

.build-software-cta {
    padding: 40px 0 0;
    background: #fff;
}

.build-software-cta__wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
    border-radius: 28px;
    overflow: hidden;
  
}

.build-software-cta__info {
    position: relative;
    padding: 56px 48px;
  
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.build-software-cta__info h2 {
    margin: 18px 0 12px;
    color: #000000;
    font-size: 6dvb;
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1.15;
}

.build-software-cta__info > p {
    margin: 0;
    color: #000 !important;
    font-size: 20px;
    line-height: 1.7;
    max-width: 480px;
}

.build-software-cta__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    margin-top: 32px;
}

.build-software-cta__badges span {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #000;
    font-size: 18px;
    font-weight: 600;
}

.build-software-cta__badges img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    filter: brightness(0);
}

.build-software-cta__form {

    padding: 40px;
    display: flex;
    align-items: center;
}

.build-software-cta__form .row {
    width: 100%;
    margin: 0;
}

.build-software-cta__form .col-md-5,
.build-software-cta__form .col-lg-5 {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
}

.build-software-cta__form .top-area-form {
    margin: 0;
    background: #014088;
    border-radius: 16px;
}

.build-software-cta__form .top-area-form button {
    background: #014088;
    border-color: #fff !important;
}

@media (hover: hover) {
    .build-software-cta__form .top-area-form button:hover {
        background: #fff;
        color: #014088;
    }
}
.build-software-cta {
    position: relative;
    overflow: hidden;
    padding: 100px 0;
    background:
        radial-gradient(circle at 10% 30%, rgba(0, 122, 255, 0.12), transparent 35%),
        radial-gradient(circle at 90% 20%, rgba(0, 72, 180, 0.15), transparent 35%),
        linear-gradient(135deg, #f7f9ff 0%, #ffffff 55%, #eef4ff 100%);
}


/* soft background circles */
.build-software-cta::before {
    content: "";
    position: absolute;
    width: 350px;
    height: 350px;
    top: -120px;
    left: -120px;
    background: rgba(0, 98, 255, 0.08);
    border-radius: 50%;
    filter: blur(10px);
}

.build-software-cta::after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    bottom: -180px;
    right: -120px;
    background: rgba(0, 72, 180, 0.12);
    border-radius: 50%;
    filter: blur(20px);
}


/* keep content above background */
.build-software-cta .container {
    position: relative;
    z-index: 2;
}


/* left content */
.build-software-cta h2 {
    position: relative;
}


/* optional highlight card behind form */
.build-software-cta form {
    backdrop-filter: blur(8px);
    border-radius: 20px;
}

/* Responsive */

@media(max-width:1024px){

    .devtrust_wrapper {
        flex-direction:column-reverse;
        gap:45px;
    }

    .devtrust_team,
    .devtrust_content {
        width:100%;
    }

}

@media(max-width:991px){

    .testi-feedback-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .testi-feedback-head p {
        max-width: 100%;
    }

    .testi-video-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .agency-intro-top {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .build-software-cta__wrap {
        grid-template-columns: 1fr;
    }

    .build-software-cta__info {
        padding: 40px 32px;
    }

}


@media(max-width:600px){

    .devtrust_grid {
        grid-template-columns:1fr;
    }

    .devtrust_card:nth-child(odd) {
        border-right:0;
    }

    .devtrust_content h2 {
        font-size:34px;
    }

    .devtrust_content p {
        font-size:16px;
    }

    .devtrust_card img {
        width:75px;
        height:75px;
    }

    .testi-feedback-sec,
    .testi-video-sec,
    .agency-intro-sec,
    .build-software-cta {
        padding: 50px 0;
    }

    .testi-feedback-head h2 {
        font-size: 30px;
    }

    .testi-feedback-cards {
        grid-template-columns: 1fr;
    }

    .testi-video-content h2 {
        font-size: 28px;
    }

    .testi-video-quote {
        font-size: 18px;
    }

    .agency-intro-top h2 {
        font-size: 28px;
    }

    .agency-intro-badge {
        padding: 12px 18px;
        border-radius: 12px 0 0 0;
    }


    .build-software-cta__wrap {
        border-radius: 20px;
    }

    .build-software-cta__info {
        padding: 32px 24px;
    }

    .build-software-cta__info h2 {
        font-size: 28px;
    }

    .build-software-cta__form {
        padding: 24px;
    }

}
/* Tablet */
@media(max-width:1100px) {

    .process_simple_head {
        flex-direction: column;
        align-items: flex-start;
    }

    .process_simple_img {
        width: 100%;
        height: 300px;
    }

    .process_simple_steps {
        grid-template-columns: repeat(2,1fr);
    }

    .process_step:nth-child(2)::after {
        display:none;
    }

    .process_bottom_bar {
        width: 80%;
    }
}


/* Mobile */
@media(max-width:767px) {

    .process_simple_sec {
        padding-top: 50px;
    }

    .process_simple_head h2 {
        font-size: 34px;
        letter-spacing: -.5px;
    }

    .process_simple_head p {
        font-size: 15px;
    }

    .process_simple_img {
        height: 200px;
    }

    .process_simple_steps {
        grid-template-columns: 1fr;
        gap: 40px;
        margin-top: 45px;
    }

    .process_step::after {
        display:none !important;
    }

    .process_step h3 {
        font-size: 22px;
    }

    .process_step p {
        font-size: 15px;
    }

    .process_bottom_bar {
        width: 100%;
        margin-top: 45px;
        padding: 25px 15px;
        font-size: 18px;
        transform:none;
    }

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

    .mvpflow-card,
    .mvpflow-card:nth-child(4),
    .mvpflow-card:nth-child(5) {
        grid-column: auto;
    }

    /* 6-card variant has an even count, so the trailing card belongs
       in the 2-column grid like every other card instead of being
       centered as a lone leftover. Cards 4 and 5 also carry a
       higher-specificity "span 2" from the desktop 6-column layout
       (.mvpflow-grid--six .mvpflow-card:nth-child(...)) that must be
       reset here or they keep forcing a full-width row and knock the
       rest of the grid out of its normal 2-per-row flow. */
    .mvpflow-grid--six .mvpflow-card:nth-child(4),
    .mvpflow-grid--six .mvpflow-card:nth-child(5),
    .mvpflow-grid--six .mvpflow-card:last-child {
        grid-column: auto;
        width: auto;
        justify-self: stretch;
    }
}

@media (max-width: 767px) {
    .mvpflow-section {
        padding: 65px 0;
    }

    .mvpflow-heading {
        margin-bottom: 32px;
    }

    .mvpflow-heading h2 {
        font-size: 36px;
        letter-spacing: -1px;
    }

    .mvpflow-heading p {
        font-size: 15px;
        line-height: 1.65;
    }

    .mvpflow-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .mvpflow-card,
    .mvpflow-grid--six .mvpflow-card:nth-child(4),
    .mvpflow-grid--six .mvpflow-card:nth-child(5),
    .mvpflow-grid--six .mvpflow-card:last-child {
        grid-column: auto;
        width: 100%;
        justify-self: stretch;
    }

    .mvpflow-visual {
        height: 190px;
        margin: 14px 14px 0;
    }

    .mvpflow-content {
        padding: 25px 23px 28px;
    }

    .mvpflow-content h3 {
        min-height: auto;
        padding-right: 40px;
        font-size: 24px;
    }

    .mvpflow-content > p {
        min-height: auto;
    }
}

@media (max-width: 991px) {
    .aimvp-page .web_app_header .container {
display: block !important;
    }
}
@media (max-width: 768px) {
.portfolio_headarea.career_header.web_app_header {
    padding: 100px 0 50px !important;
}
.saas-img img {
    height: auto;
}
.aimvp-page .web_app_header > .container > aside > p:first-of-type {
    margin-top: 20px;
}
div#myModal {
    overflow: auto;
}
.copyryt {
    font-size: 15px;
}
.common_sec .heading_new h2 {
    margin-bottom: 8px;
}
.casestudty_slider_sec.common_sec h2 {
    line-height: 1.2;
}
.casestudty_slider_sec.common_sec {
    margin-top: 40px;
}
.Staff_section.why_choose_netset {
    padding: 0px 0 40px;
}
.industries-solution-btn {
    width: 100%;
    text-wrap: auto;
}
section.common_sec.our_techno.price_section {
    padding-top: 40px;
}
span#captcha_error {
    margin-top: -6px;
    margin-bottom: 15px;
}
}

@media (max-width:600px){

}


@media (min-width:1025px){
.orange_button.roundd_button:focus:hover {
  
    background: #b0d9f1;
}
a.orange_button.roundd_button.btn_bigg:focus:hover{
    background: #ed5f00 !important;
    color: #fff !important;
}

.case-study-inner-content a:focus:hover,
.new-case-button .outline-btn:focus:hover,
.sportsfinda-content a:focus:hover {
    color: #fff !important;
    background: #ed5f00 !important; 
}
.case-study-inner-content a:hover,
.new-case-button .outline-btn:hover,
.sportsfinda-content a:hover{
    background: #ed5f00 !important;
    color: #fff !important;
}
}

/* ==========================================================================
   Services page (services/index.astro): hero overview cards jump-links,
   tabbed sub-services section (desktop side-tabs + mobile accordion).
   Moved here from a page-scoped <style> block so it's maintained in the
   shared stylesheet like the rest of the site's CSS.
   ========================================================================== */

.services-jump-card {
    display: block;
    text-decoration: none;
    cursor: pointer;
}

.services-tabs-sec {
    padding: 90px 0;
    background: #fff;
}

.services-tabs-wrapper {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    background: #f7f8fb;
    border: 1px solid rgba(35, 24, 82, 0.08);
    border-radius: 20px;
    padding: 32px;
}

.services-tabs-nav {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 320px;
    flex-shrink: 0;
}

.services-tab-btn {
    display: block;
    width: 100%;
    padding: 13px 14px;
    background: transparent;
    border: none;
    border-left: 3px solid transparent;
    border-radius: 10px;
    color: #555555;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.35;
    text-align: left;
    cursor: pointer;
    transition: background 0.2s ease,color 0.2s ease,border-color 0.2s ease;
}

.services-tab-btn:hover {
    background: rgba(1, 64, 136, 0.06);
    color: #014088;
}

.services-tab-btn.active {
    background: #fff;
    border-left-color: #014088;
    color: #014088;
    box-shadow: 0 8px 22px rgba(20, 38, 92, 0.08);
}

.services-tabs-panels {
    flex: 1;
    min-width: 0;
}

.services-tab-panel {
    display: none;
}

.services-tab-panel.active {
    display: block;
}

.services-tab-image {
    width: 100%;
    height: 280px;
    margin-bottom: 28px;
    overflow: hidden;
    border-radius: 14px;
}

.services-tab-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.services-tab-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    background: #fff;
    padding: 8px 28px;
    border-radius: 14px;
}

.services-tab-list a {
    display: block;
    padding: 8px 0;
    color: #333 ! important;
    font-size: 17px;
    font-weight: 400;
    text-decoration: none;
    transition: color 0.2s ease;
}

.services-tab-list a:hover {
    color: #014088 ! important;
}

.services-tab-list a span {
    margin-right: 6px;
    color: #014088;
    font-weight: 500;
}

/* mobile accordion (hidden by default, shown at <=767px) */
.services-accordion {
    display: none;
}

.services-accordion-item {
    border-bottom: 1px solid rgba(35, 24, 82, 0.1);
}

.services-accordion-item:first-child {
    border-top: 1px solid rgba(35, 24, 82, 0.1);
}

.services-accordion-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    padding: 16px 4px;
    background: transparent;
    border: none;
    color: #333145;
    font-size: 18px;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
}

.services-accordion-header.active {
    color: #014088;
}

.services-accordion-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #eef1fb;
    color: #014088;
    font-size: 16px;
    line-height: 1;
    transition: background 0.2s ease, color 0.2s ease;
}

.services-accordion-header.active .services-accordion-icon {
    background: #014088;
    color: #fff;
}

.services-accordion-panel {
    display: none;
    padding: 0 4px 22px;
}

.services-accordion-panel.open {
    display: block;
}

.services-accordion-panel .services-tab-image {
    height: 150px;
    margin-bottom: 16px;
    border-radius: 10px;
}

.services-accordion-panel .services-tab-list {
    grid-template-columns: 1fr;
    padding: 0;
    background: transparent;
    gap: 0;
}

.services-accordion-panel .services-tab-list a {
    padding: 10px 0;
    font-size: 14px;
}

@media (max-width: 1024px) {
    .services-tabs-wrapper {
        flex-direction: column;
        padding: 22px;
    }

    .services-tabs-nav {
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .services-tab-btn {
        width: auto;
        flex: 1 1 auto;
        border-left: none;
        border-bottom: 3px solid transparent;
        text-align: center;
    }

    .services-tab-btn.active {
        border-left-color: transparent;
        border-bottom-color: #014088;
    }

    .services-tab-image {
        height: 220px;
    }
}

@media (max-width: 600px) {
    .services-tabs-sec {
        padding: 55px 0;
    }

    .services-tabs-wrapper {
        padding: 16px;
        border-radius: 14px;
    }

    .services-tab-btn {
        font-size: 14px;
        padding: 12px 14px;
    }

    .services-tab-list {
        grid-template-columns: 1fr;
        padding: 4px 18px;
    }

    .services-tab-image {
        height: 170px;
        margin-bottom: 18px;
    }
}

@media (max-width: 1024px) {
    .services-tabs-sec {
        padding: 50px 0;
    }

    .services-tabs-wrapper {
        display: none;
    }

    .services-accordion {
        display: block;
    }
}

/* ============================================================
   AI Development Technology Stack (.techno-stack) - fix Bootstrap 3
   float-grid gap bug. The mixed col-md-4/col-md-3 float columns,
   combined with .techno-comps-space's extra top margin, made floats
   pack unevenly and leave large empty gaps between rows. CSS grid
   replaces the float grid with a controlled column count and a
   consistent gap at every width: 1 card/row below 1024px, 2/row
   from 1024-1199px (e.g. iPad Pro), 3/row from 1200px up.
   ============================================================ */
.techno-stack .row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

.techno-stack .row::before,
.techno-stack .row::after {
    content: none;
    display: none;
}

.techno-stack .row > [class*="col-md-"] {
    width: 100%;
    float: none;
    padding: 0;
}

.techno-stack .techno-comps-space {
    margin: 0;
}

@media (min-width: 1024px) and (max-width: 1199px) {
    .techno-stack .row {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1200px) {
    .techno-stack .row {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* ============================================================
   "Recognized & Trusted By" logo strip (.ai-global-impression)
   At tablet widths (iPad portrait ~768px up to iPad Pro 1024px)
   the flex row only has room for 3 of the 4 fixed-width logos,
   so the 4th one wraps alone onto its own line. Force a deliberate
   2x2 grid in that range instead.
   ============================================================ */
@media (min-width: 768px) and (max-width: 1024px) {
    .ai-global-impression {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        justify-items: center;
        gap: 30px 20px;
    }
}

/* ============================================================
   ChatGPT "Streamlined Execution" timeline (.our-execution)
   On mobile the zigzag connectors are hidden and every card
   goes full-width, but the cards had no vertical gap between
   them so they touched border-to-border. Add spacing.
   ============================================================ */
@media (max-width: 767px) {
    .our-execution ul.test li {
        margin-bottom: 20px;
    }

    .our-execution ul.test li:last-child {
        margin-bottom: 0;
    }
}

/* ============================================================
   "Wide Set of Benefits" tab/pill list (.mvp_dev_process)
   On tablet/mobile the pill list stacks above a single shared
   content panel, so clicking a pill updates content far below
   with no visible connection to the click. mvp-dev-process-
   accordion.js (loaded site-wide from Footer.astro) relocates
   the single .tab-content panel to sit right after the active
   pill under 1024px, turning it into a real accordion. This
   just supplies the accordion visuals for that state.
   ============================================================ */
@media (max-width: 1024px) {
    .mvp_dev_process .row {
        display: block;
    }

    .mvp_dev_process .row > [class*="col-"] {
        width: 100%;
        float: none;
    }

    .mvp_dev_process .nav.nav-pills li {
        display: block;
    }

    .mvp_dev_process .nav.nav-pills li a {
        position: relative;
        display: block;
        padding-right: 46px;
    }

    .mvp_dev_process .nav.nav-pills li a:after {
        content: "+";
        position: absolute;
        top: 50%;
        right: 16px;
        transform: translateY(-50%);
        font-size: 20px;
        font-weight: 700;
        line-height: 1;
    }

    .mvp_dev_process .nav.nav-pills li.active a:after {
        content: "\2212";
    }

    .mvp_dev_process .tab-content {
        clear: both;
        margin: 0 0 10px !important;
        border: 2px solid rgba(255, 255, 255, .15);
        border-top: none;
    }
}

/* ============================================================
   FAQ accordion (.technologies-area .accordian_box) - sitewide.
   The live +/- icon is generated by ::after (style.min.css), not
   ::before - an earlier fix here targeted ::before and had no
   effect on the real icon. float:right on that ::after only
   aligns to the first line of the question, so it drifts out of
   position whenever the question text wraps to 2+ lines, and an
   earlier flex+space-between attempt caused the question text
   itself to render as a separate centered flex item instead of
   staying left-aligned. Switch to block layout (natural left-
   aligned text) with the icon absolutely positioned and vertically
   centered against the full (possibly multi-line) block instead.
   Used across 200+ pages, so fixed once here rather than per-page.
   ============================================================ */
@media (max-width: 1024px) {
    .technologies-area .accordian_box .panel-title a {
        display: block !important;
        position: relative;
        text-align: left;
        padding-right: 34px;
        line-height: 1.4;
    }

    .technologies-area .accordian_box .panel-title > a:after,
    .technologies-area .accordian_box .panel-title > a.collapsed:after {
        float: none !important;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        margin: 0;
        padding: 0 !important;
    }
}

@media (max-width: 767px) {
    .technologies-area .accordian_box .panel-title a {
        font-size: 18px !important;
    }
}

/* ============================================================
   "Let's Talk" CTA banner (.lets_talk) - iPad range.
   The heading and button are both floated with mismatched
   margin-top/height, so the button sits ~12px above the true
   vertical center of the (often 2-line) heading text on tablet
   widths. Flexbox centers them regardless of each one's height.
   ============================================================ */
@media (min-width: 768px) and (max-width: 1024px) {
    .lets_talk .container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
    }

    .lets_talk .heading_lable {
        float: none;
        margin: 0;
    }

    .lets_talk .orange_button.roundd_button {
        float: none;
        margin: 0;
        flex-shrink: 0;
    }

    /* .ai-contact-form pages (generative-ai-consulting-company and its
       siblings) nest the heading/button inside the contact-us form's
       wrapper markup (#contct_from_new > .contact-page-inners > .row >
       .col-sm-12) instead of putting them directly in .container. That
       wrapper becomes the lone flex child above and shrinks to its
       content width instead of filling the banner, so it renders as a
       small off-left box. Drop back to block layout here so the wrapper
       takes the full width and the heading/button (float: none above)
       stack left-aligned, same as the other breakpoints. */
    .ai-contact-form.lets_talk .container {
        display: block;
    }

    .ai-contact-form.lets_talk .orange_button.roundd_button {
        margin-top: 16px;
    }
}

/* ============================================================
   Case study full-width images (.casestudy_content aside.col-sm-12 img)
   These bare <img> tags render at their natural size (often
   narrower than the column) and, being inline elements with no
   text-align on the parent, default to the left - leaving a big
   empty gap on the right instead of sitting centered in the page.
   Shared across 50+ case-study pages, so fixed once here.
   ============================================================ */
.casestudy_content aside.col-sm-12 > img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* ============================================================
   "Pick a Hiring Model" engagement tabs (.aimvp-page wrapper)
   The .aimvp-page rules (new-home.css ~2619-2674) only stack the
   tab image/text into a single column below 767px; between
   768-1024px (iPad) they fall through to the desktop flex-nowrap
   layout (#price.tab-pane .row: flex-wrap:nowrap, .tab_image:
   width 42%), which squeezes the illustration into a tiny column.
   These selectors include an #price ID, so the earlier attempt to
   fix this via the generic .price_section selector (lower
   specificity) never actually applied. Extend the same "stack it"
   behaviour already used below 767px up to 1024px instead. Used
   on 100+ pages via the shared .aimvp-page wrapper, so fixed once
   here.
   ============================================================ */
@media (max-width: 1024px) {
    .aimvp-page .our_techno .tab-content .row {
        flex-direction: column;
    }

    .aimvp-page .our_techno .tab-content .tab_text ul li {
        width: 100%;
    }

    .aimvp-page .our_techno .tab_image,
    .aimvp-page .our_techno .tab_text {
        width: 100%;
        max-width: 100%;
        flex: 1 1 100%;
    }

    .aimvp-page #price.tab-pane .row {
        flex-direction: column;
        flex-wrap: wrap;
        gap: 24px;
    }

    .aimvp-page #price.tab-pane .tab_image,
    .aimvp-page #price.tab-pane .tab_text {
        width: 100%;
        max-width: 100%;
        flex: 1 1 100%;
    }
}

/* ============================================================
   Career page: Professional Behaviour / Join Us / Direct
   Submission CTA redesign (career.astro)
   ============================================================ */

/* ---- Professional Behaviour ---- */
body.Career .professional_behaviour {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #f3f6f6 0%, #eaf1fb 100%);
}

body.Career .professional_behaviour::before,
body.Career .professional_behaviour::after {
    content: "";
    position: absolute;
    z-index: 0;
    border-radius: 50%;
    filter: blur(70px);
    opacity: 0.3;
    pointer-events: none;
}

body.Career .professional_behaviour::before {
    width: 320px;
    height: 320px;
    top: -130px;
    left: -110px;
    background: #014088 ;
}

body.Career .professional_behaviour::after {
    width: 280px;
    height: 280px;
    right: -90px;
    bottom: -110px;
    background: #ed5f00;
}

body.Career .professional_behaviour .container {
    position: relative;
    z-index: 1;
}

body.Career .pb-wrap {
    margin-top: 44px;
}

body.Career .pb-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: max-content;
    max-width: 100%;
    margin: 0 auto 40px;
    padding: 14px 34px;
    border-radius: 50px;
    background: linear-gradient(97deg, #014088 0%, #014088 100%);
    box-shadow: 0 14px 34px rgba(8, 106, 216, 0.28);
    color: #fff;
    font-size: 20px;
    font-weight: 700;
}

body.Career .pb-badge i {
    color: #ed5f00;
    font-size: 18px;
}

body.Career .pb-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    list-style: none;
    margin: 0;
    padding: 0;
}

body.Career .pb-card {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 24px 22px;
    background: #fff;
    border: 1px solid rgba(8, 106, 216, 0.08);
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(18, 17, 17, 0.05);
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

body.Career .pb-card:hover {
    transform: translateY(-8px);
    border-color: rgba(8, 106, 216, 0.35);
    box-shadow: 0 20px 45px rgba(8, 106, 216, 0.16);
}

body.Career .pb-icon {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: linear-gradient(135deg, #014088 0%, #ed5f00 130%);
    color: #fff;
    font-size: 20px;
    transition: transform 0.35s ease;
}

body.Career .pb-card:hover .pb-icon {
    transform: rotate(-8deg) scale(1.08);
}

body.Career .pb-card p {
    margin: 0;
    padding-top: 6px;
    color: var(--paragraphColor);
    font-size: 16.5px;
    font-weight: 500;
    line-height: 1.5;
}

/* ---- Join Us / Browse Jobs ---- */
body.Career .join_us .contentttt {
    margin-top: 40px;
}

body.Career .join_us_tab .nav-pills {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

body.Career .join_us_tab .nav-pills > li {
    width: 100%;
}

body.Career .join_us_tab .nav-pills > li > a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(18, 17, 17, 0.04);
    color: var(--headingColor);
    font-size: 17px;
    font-weight: 600;
    transition: all 0.3s ease;
}

body.Career .join_us_tab .nav-pills > li > a i {
    width: 20px;
    color: #014088 ;
    font-size: 17px;
    text-align: center;
    transition: color 0.3s ease;
}

body.Career .join_us_tab .nav-pills > li > a:hover {
    border-color: rgba(8, 106, 216, 0.3);
    transform: translateX(4px);
}

body.Career .join_us_tab .nav-pills > li.active > a,
body.Career .join_us_tab .nav-pills > li.active > a:focus,
body.Career .join_us_tab .nav-pills > li.active > a:hover {
    background: linear-gradient(97deg, #014088 0%, #014088 100%);
    border-color: transparent;
    box-shadow: 0 14px 30px rgba(8, 106, 216, 0.28);
    color: #fff;
    transform: translateX(6px);
}

body.Career .join_us_tab .nav-pills > li.active > a i {
    color: #ffffff;
}

body.Career .join_us_content .accordian_box {
    margin-bottom: 18px;
}

body.Career .join_us_content .accordian_box .panel.panel-default {
    margin-bottom: 16px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(18, 17, 17, 0.05);
}

body.Career .join_us_content .accordian_box .panel-heading {
    padding: 0;
    background: #fff;
}

body.Career .join_us_content .accordian_box .panel-title a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px;
    color: var(--headingColor);
    font-size: 18px;
    font-weight: 700;
}

body.Career .join_us_content .accordian_box .panel-title > a:after {
    content: "\2212";
    width: 28px;
    height: 28px;
    margin: 0;
    padding: 0;
    background: #014088 ;
    border-radius: 50%;
    color: #fff;
    font-family: inherit;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    float: none;
    transition: background 0.3s ease, color 0.3s ease;
}

body.Career .join_us_content .accordian_box .panel-title > a.collapsed:after {
    content: "+";
    background: rgba(8, 106, 216, 0.1);
    color: #014088 ;
    padding: 0;
    float: none;
}

body.Career .join_us_content .accordian_box .job_list {
    padding: 0 22px 20px;
}

body.Career .join_us_content .accordian_box .job_list li a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 10px;
    color: var(--paragraphColor);
    font-size: 16px;
    font-weight: 500;
    transition: all 0.25s ease;
}

body.Career .join_us_content .accordian_box .job_list li a:before {
    content: "\2192";
    color: #ed5f00;
    font-weight: 700;
}

body.Career .join_us_content .accordian_box .job_list li a:hover {
    background: rgba(8, 106, 216, 0.06);
    color: #014088 ;
    padding-left: 20px;
}

@media (max-width: 991px) {
    body.Career .pb-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    body.Career .join_us_tab .nav-pills {
        flex-direction: row;
        flex-wrap: wrap;
    }

    body.Career .join_us_tab .nav-pills > li {
        width: auto;
    }

    body.Career .join_us_tab .nav-pills > li > a {
        padding: 10px 16px;
        font-size: 15px;
    }

    body.Career .join_us_tab .nav-pills > li.active > a,
    body.Career .join_us_tab .nav-pills > li > a:hover {
        transform: none;
    }
}

@media (max-width: 600px) {
    body.Career .pb-grid {
        grid-template-columns: 1fr;
    }

    body.Career .pb-badge {
        padding: 12px 22px;
        font-size: 16px;
        text-align: center;
    }
}

/* ---- Direct Submission CTA ---- */
body.Career .direct_submission_cta {
    position: relative;
    overflow: hidden;
    padding: 80px 0;
    background: linear-gradient(120deg, #ed5f00 0%, #ff8a3d 45%, #014088 100%);
}

body.Career .direct_submission_cta::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 15% 20%, rgba(255, 255, 255, 0.18), transparent 45%),
                radial-gradient(circle at 85% 80%, rgba(255, 255, 255, 0.14), transparent 40%);
    pointer-events: none;
}

body.Career .ds-card {
    position: relative;
    z-index: 1;
    max-width: 780px;
    margin: 0 auto;
    text-align: center;
}

body.Career .ds-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 74px;
    height: 74px;
    margin-bottom: 22px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 28px;
    animation: dsFloat 3s ease-in-out infinite;
}

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

body.Career .direct_submission_cta h2 {
    margin: 0 0 14px;
    color: #fff;
    font-size: 32px;
    font-weight: 700;
}

body.Career .direct_submission_cta .ds-card > p {
    margin: 0 0 34px;
    color: rgba(255, 255, 255, 0.92);
    font-size: 17px;
}

body.Career .ds-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 18px;
}

body.Career .ds-pill {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 26px;
    background: #fff;
    border-radius: 50px;
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18);
    color: #ed5f00;
    font-size: 16px;
    font-weight: 700;
    text-align: left;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

body.Career .ds-pill span {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}
.mvpflow-content h3 {
    color: #000;
    margin-bottom: 17px;
    font-weight: 700;
    font-size: 26px;
}
body.Career .ds-pill small {
    display: block;
    color: inherit;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    opacity: 0.6;
}

body.Career .ds-pill i {
    font-size: 20px;
}

body.Career .ds-pill:hover {
    color: #ed5f00;
    transform: translateY(-4px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.24);
}

body.Career .ds-pill--outline {
    background: rgba(255, 255, 255, 0.12);
    border: 1.5px solid rgba(255, 255, 255, 0.6);
    color: #fff;
}

body.Career .ds-pill--outline:hover {
    background: #fff;
    color: #014088 ;
}

@media (max-width: 600px) {
    body.Career .direct_submission_cta h2 {
        font-size: 24px;
    }

    body.Career .ds-actions {
        flex-direction: column;
        align-items: center;
    }

    body.Career .ds-pill {
        width: 100%;
        max-width: 340px;
        justify-content: center;
    }
}

/* ---- Scroll-reveal (self-contained, no external animation lib) ----
   Elements are fully visible by default. JS only adds ".reveal" (hidden
   start state) when IntersectionObserver is available, then flips in
   ".in-view" as each element scrolls in — so a JS failure never hides
   content. */
body.Career .js-reveal.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

body.Career .js-reveal.reveal.in-view {
    opacity: 1;
    transform: translateY(0);
}

body.Career .pb-grid .pb-card.reveal:nth-child(3n+1) { transition-delay: 0s; }
body.Career .pb-grid .pb-card.reveal:nth-child(3n+2) { transition-delay: 0.1s; }
body.Career .pb-grid .pb-card.reveal:nth-child(3n+3) { transition-delay: 0.2s; }

/* ===== our-story.astro — "We Gained Trust From Our Transformations" year timeline ===== */
.story-timeline {
    margin-top: 44px;
}

.story-timeline__stage {
    position: relative;
}

.story-timeline__slides {
    position: relative;
    display: grid;
}

.story-timeline__slide {
    grid-area: 1 / 1;
    display: grid;
    grid-template-columns: minmax(220px, 320px) 1fr;
    align-items: center;
    gap: 56px;
    opacity: 0;
    transform: translateX(28px);
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.5s ease, transform 0.5s ease, visibility 0s linear 0.5s;
}

.story-timeline__slide.is-active {
    opacity: 1;
    transform: translateX(0);
    visibility: visible;
    pointer-events: auto;
    transition: opacity 0.5s ease, transform 0.5s ease;
}

.story-timeline__media img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border-radius: 20px;
    background: #eef3fa;
    box-shadow: 0 30px 70px -25px rgba(1, 64, 136, 0.4);
    transform: rotate(-4deg);
    transition: transform 0.5s ease;
    margin-left: 20px;
}

.story-timeline__figure {
    display: flex;
    flex-direction: column;
}

.story-timeline__year {
    font-size: clamp(56px, 13vw, 254px);
    font-weight: 900;
    line-height: 0.8;
    letter-spacing: -7px;
    color: #014088;
    margin-bottom: 27px;
}

.story-timeline__text {
    align-self: flex-end;
    max-width: 68%;
    margin-top: -14px;
    position: relative;
    z-index: 1;
    font-size: 18px;
    line-height: 1.7;
    color: #3b4759;
    text-align: left;
}

.story-timeline__nav {
    margin-top: 56px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.story-timeline__nav::-webkit-scrollbar {
    display: none;
    height: 0;
}

.story-timeline__track {
    position: relative;
    display: flex;
    gap: 0;
    padding: 0 6px;
}

.story-timeline__track::before,
.story-timeline__track::after {
    content: "";
    position: absolute;
    left: 6px;
    right: 6px;
    top: 9px;
    height: 2px;
}

.story-timeline__track::before {
    background: #d7e3f1;
}

.story-timeline__track::after {
    background: #014088;
    width: var(--story-progress, 0%);
    transition: width 0.5s ease;
}

.story-timeline__node {
    position: relative;
    z-index: 1;
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    font: inherit;
}

.story-timeline__dot {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #014088;
    background: #fff;
    transition: all 0.3s ease;
}

.story-timeline__node:hover .story-timeline__dot {
    border-color: #014088;
    background: rgba(1, 64, 136, 0.15);
}

.story-timeline__node.is-active .story-timeline__dot {
    width: 34px;
    border-radius: 9px;
    background: #014088;
}

.story-timeline__label {
    font-size: 14px;
    font-weight: 600;
    color: #a7b0bd;
    white-space: nowrap;
    transition: color 0.3s ease;
}

.story-timeline__node.is-active .story-timeline__label {
    color: #014088;
    font-size: 15px;
}

.story-timeline__node:focus-visible {
    outline: 2px solid #014088;
    outline-offset: 4px;
    border-radius: 8px;
}

@media (max-width: 767px) {
    .story-timeline__slide {
        grid-template-columns: 1fr;
        gap: 20px;
        text-align: center;
    }

    .story-timeline__media img {
        max-width: 240px;
        margin: 0 auto;
        transform: rotate(-2deg);
    }

    .story-timeline__figure {
        align-items: center;
    }

    .story-timeline__year {
        font-size: 56px;
    }

    .story-timeline__text {
        align-self: center;
        max-width: 100%;
        margin-top: 4px;
        text-align: center;
        font-size: 13.5px;
    }

    .story-timeline {
        max-width: 100%;
        overflow-x: hidden;
    }

    .story-timeline__nav {
        margin-top: 32px;
        max-width: 100%;
    }

    .story-timeline__track {
        min-width: 640px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .story-timeline__slide,
    .story-timeline__media img,
    .story-timeline__dot,
    .story-timeline__label,
    .story-timeline__track::after {
        transition: none;
    }
}

/* ===== our-story.astro — "Our Business Binding Cord" ===== */
.bcord-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 40px;
}

.bcord-card {
    position: relative;
    background: #fff;
    border: 1px solid rgba(1, 64, 136, 0.08);
    border-radius: 24px;
    padding: 36px 30px 32px;
    text-align: left;
    box-shadow: 0 12px 30px rgba(6, 18, 47, 0.08);
    overflow: hidden;
    transition: transform 0.35s ease, box-shadow 0.35s ease, background-color 0.35s ease;
}

.bcord-card::after {
    content: "";
    position: absolute;
    inset: auto -50px -50px auto;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(1, 64, 136, 0.08) 0%, rgba(1, 64, 136, 0) 72%);
    pointer-events: none;
}

.bcord-card__index {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    margin-bottom: 22px;
    border-radius: 50%;
    background: rgba(1, 64, 136, 0.08);
    border: 1px solid rgba(1, 64, 136, 0.12);
    color: #014088;
    font-size: 18px;
    font-weight: 700;
    transition: all 0.35s ease;
}

.bcord-card h3 {
    position: relative;
    z-index: 1;
    margin: 0 0 12px;
    font-size: 22px;
    font-weight: 700;
    color: #06122f;
    transition: color 0.35s ease;
}

.bcord-card p {
    position: relative;
    z-index: 1;
    margin: 0;
    font-size: 15.5px;
    line-height: 1.65;
    color: #44506f;
    transition: color 0.35s ease;
}

.bcord-card:hover {
    transform: translateY(-6px);                                            
    background: #014ea7f7;
    box-shadow: 0 22px 50px rgba(1, 64, 136, 0.22);
}

.bcord-card:hover h3,
.bcord-card:hover p {
    color: #fff;
}

.bcord-card:hover .bcord-card__index {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.18);
    color: #fff;
}

@media (max-width: 991px) {
    .bcord-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 599px) {
    .bcord-grid {
        grid-template-columns: 1fr;
    }
}




.build-hero__inner--split {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 48px;
    max-width: 1300px;
    text-align: left;
}

.build-hero__inner--split .build-hero__content {
    flex: 1 1 560px;
    max-width: 640px;
}

.build-hero__inner--split h1 {
    margin: 0 0 18px;
    text-align: left;
}

.build-hero__inner--split .blockchain-para {
    color: rgba(255, 255, 255, 0.88);
}

.build-hero__inner--split .records h2 {
    margin: 0;
    color: #fff;
}

.build-hero__inner--split .records p {
    margin: 4px 0 0;
    color: rgba(255, 255, 255, 0.75);
}

.build-hero__inner--split .records {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 14px;
    padding: 14px 18px;
    backdrop-filter: blur(6px);
}

.build-hero__inner--split ul.unde-blockchain-points li span {
    color: rgba(255, 255, 255, 0.88);
}

.build-hero__inner--split ul.unde-blockchain-points li span img {
    border-color: rgba(255, 255, 255, 0.6);
    background: rgba(255, 255, 255, 0.12);
}

.build-hero__inner--split .blockchain-call-action {
    margin-top: 26px;
}

.build-hero__inner--split .top-area-form {
    flex: 0 1 420px;
    margin: 0;
}

@media (max-width: 991px) {
    .build-hero__inner--split {
        flex-direction: column;
    }

    .build-hero__inner--split .top-area-form {
        margin: 0 auto;
        width: 100%;
        max-width: 460px;
    }
}

/* Icon-style visual for service cards whose source art is a small square
   icon (not a pre-cropped banner photo like the other .mvpflow-visual-*
   variants) — centers it in a softly tinted panel instead of stretching it
   to cover the full 215px visual area. */
.mvpflow-visual--icon {
    background: linear-gradient(135deg, rgba(1, 64, 136, 0.07), rgba(1, 64, 136, 0.02));
    border-radius: 14px;
}

.mvpflow-visual--icon img {
    max-width: 110px;
    max-height: 110px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.mvpflow-card-link {
    display: block;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

.mvpflow-readmore {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    color: #014088;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.mvpflow-readmore:hover {
    text-decoration: underline;
}

/* CTA card that replaces one slot in the services grid (matches the
   original "Start Your MVP Journey Today" highlight box). */
.mvpflow-card--cta {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100%;
    padding: 40px 24px;
    background: #014088;
    text-align: center;
    text-decoration: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

.mvpflow-card--cta:hover {
    transform: translateY(-8px);
    background: #012c5e;
    box-shadow: 0 22px 55px rgba(1, 64, 136, 0.35);
}

.mvpflow-card--cta h3 {
    margin: 0;
    color: #fff;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -0.5px;
    line-height: 1.3;
}

/* =========================================================
   Partner page (partner.astro) — scoped under .partner-page
   ========================================================= */
.partner-page .mvpflow-heading.text-center {
    margin-left: auto;
    margin-right: auto;
}

.partner-page .mvpflow-heading.text-center p {
    margin-left: auto;
    margin-right: auto;
}

section.partner-hero {
        background-image: url(/images/specialization-main.webp) !important;
    background-position: center 25%;
}
.mvpflow-content h3 {
    color: #000;
    margin-bottom: 17px;
}
/* Who We Partner With — icon feature list (replaces boxy 3-card grid) */
.partner-audience {
    padding: 90px 0;
    background: #fff;
}

.partner-audience-list {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    max-width: 1140px;
    margin: 0 auto;
}

.partner-audience-item {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    align-items: flex-start;
    gap: 20px;
    padding: 4px 36px;
    border-left: 1px solid rgba(1, 64, 136, 0.14);
    transition: transform 0.3s ease;
}

.partner-audience-list .partner-audience-item:first-child {
    border-left: none;
    padding-left: 4px;
}

.partner-audience-list .partner-audience-item:last-child {
    padding-right: 4px;
}

.partner-audience-item:hover {
    transform: translateY(-4px);
}

.partner-audience-icon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: rgba(1, 64, 136, 0.08);
    color: #014088;
    font-size: 26px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.partner-audience-item:hover .partner-audience-icon {
    background: #014088;
    color: #fff;
}

.partner-audience-content h3 {
    margin: 0 0 10px;
    color: #09090b;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.3px;
}

.partner-audience-content p {
    margin: 0;
    max-width: 720px;
    color: #55536a;
    font-size: 16px;
    line-height: 1.7;
}

@media (max-width: 991px) {
    .partner-audience-list {
        flex-direction: column;
    }

    .partner-audience-item {
        flex-direction: row;
        flex: none;
        gap: 28px;
        padding: 32px 4px;
        border-left: none;
        border-top: 1px solid rgba(1, 64, 136, 0.14);
    }

    .partner-audience-list .partner-audience-item:first-child {
        padding-left: 4px;
        border-top: 1px solid rgba(1, 64, 136, 0.14);
    }

    .partner-audience-list .partner-audience-item:last-child {
        padding-right: 4px;
        border-bottom: 1px solid rgba(1, 64, 136, 0.14);
    }

    .partner-audience-item:hover {
        transform: translateX(4px);
    }
}

/* How Do We Define Our Partnership — text + media */
.partner-about {
    padding: 90px 0;
    background: linear-gradient(180deg, #f7faff 0%, #fff 100%);
}

.partner-about-grid {
    display: grid;
    grid-template-columns: 0.85fr 1.15fr;
    align-items: center;
    gap: 60px;
}

.partner-about-media img {
    width: 100%;
    border-radius: 20px;
    box-shadow: 0 24px 60px rgba(1, 64, 136, 0.16);
}

.partner-about-content h2 {
    margin: 6px 0 20px;
    color: #09090b;
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1.15;
}

.partner-about-content p {
    margin: 0 0 16px;
    color: #55536a;
    font-size: 16px;
    line-height: 1.75;
}

/* Benefits of Partnering — icon-topped panels instead of bordered list boxes */
.partner-benefits {
    padding: 90px 0;
    background: #fff;
}

.partner-benefits-sub {
    max-width: 720px;
    margin: 20px auto 0;
    color: #525168;
    font-size: 17px;
    line-height: 1.75;
    text-align: center;
}

.partner-benefits-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 2px;
    margin-top: 50px;
    background: rgba(1, 64, 136, 0.1);
    border: 1px solid rgba(1, 64, 136, 0.1);
    border-radius: 20px;
    overflow: hidden;
}

.partner-benefit-card {
    padding: 34px 22px;
    background: #fff;
    text-align: center;
    transition: background-color 0.3s ease, transform 0.3s ease;
}

.partner-benefit-card:hover {
    background: #014088;
    transform: translateY(-4px);
    z-index: 1;
}

.partner-benefit-card i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 18px;
    border-radius: 50%;
    background: rgba(1, 64, 136, 0.08);
    color: #014088;
    font-size: 22px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.partner-benefit-card:hover i {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

.partner-benefit-card h3 {
    margin: 0 0 8px;
    color: #09090b;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: -0.2px;
    transition: color 0.3s ease;
}

.partner-benefit-card:hover h3 {
    color: #fff;
}

.partner-benefit-card p {
    margin: 0;
    color: #55536a;
    font-size: 13.5px;
    line-height: 1.6;
    transition: color 0.3s ease;
}

.partner-benefit-card:hover p {
    color: rgba(255, 255, 255, 0.85);
}

/* Flexible Partnership Models — connected step cards */
.partner-models {
    padding: 90px 0;
    background: linear-gradient(180deg, #f7faff 0%, #fff 100%);
}

.partner-models-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    margin-top: 55px;
}

.partner-model-card {
    position: relative;
    padding: 0 20px 0 0;
}

.partner-model-card:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 34px;
    left: 90px;
    width: calc(100% - 40px);
    border-top: 2px dashed rgba(1, 64, 136, 0.35);
}

.partner-model-icon {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 68px;
    margin-bottom: 22px;
    border-radius: 50%;
    background: #014088;
    color: #fff;
    font-size: 26px;
    box-shadow: 0 12px 26px rgba(1, 64, 136, 0.28);
}

.partner-model-step {
    display: block;
    margin-bottom: 6px;
    color: #014088;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.partner-model-content h3 {
    margin: 0 0 12px;
    color: #09090b;
    font-size: 21px;
    font-weight: 800;
    letter-spacing: -0.3px;
}

.partner-model-content p {
    margin: 0;
    color: #55536a;
    font-size: 15px;
    line-height: 1.7;
}

/* Alliance Opportunities reuses .partner-audience-list on a plain background */
.partner-alliance {
    padding: 90px 0;
    background: #fff;
}

/* Strategic Partnerships closing panel */
.partner-strategic {
    padding: 90px 0 110px;
    background: linear-gradient(135deg, #021b3d 0%, #014088 65%, #0c5cbc 100%);
}

.partner-strategic-inner {
    position: relative;
    max-width: 880px;
    margin: 0 auto;
    text-align: center;
}

.partner-strategic-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    margin-bottom: 24px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 22px;
}

.partner-strategic-inner h2 {
    margin: 0 0 24px;
    color: #fff;
    font-size: clamp(28px, 3.4vw, 40px);
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1.2;
}

.partner-strategic-inner p {
    margin: 0 0 16px;
    color: rgba(255, 255, 255, 0.82);
    font-size: 16px;
    line-height: 1.8;
}
.col-xs-12.form-captcha {
    padding-left: 0px !important;
}
section.common_sec.development_process.ar_app_development.new-devlopment-process {
    margin-top: -54px ! important;
}
section.common_sec.WEBSITE_DESIGN_SECTION.webapp-why {
    background: #0140880a;
}
@media (max-width: 991px) {
    .partner-about-grid {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .partner-about-media {
        order: -1;
    }

    .partner-benefits-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .partner-models-list {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .partner-model-card:not(:last-child)::after {
        display: none;
    }
}

@media (max-width: 767px) {
    .partner-audience-item {
        flex-direction: column;
        gap: 16px;
    }

    .partner-benefits-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .partner-hero,
    .partner-audience,
    .partner-about,
    .partner-benefits,
    .partner-models,
    .partner-alliance,
    .partner-strategic {
        padding-top: 80px;
        padding-bottom: 55px;
    }
}

@media (max-width: 480px) {
    .partner-benefits-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Engagement Model page (engagement-model.astro) — scoped
   under .engagement-page
   ========================================================= */
.engagement-page .mvpflow-heading.text-center {
    max-width: none;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.engagement-page .mvpflow-heading.text-center p {
    margin-left: auto;
    margin-right: auto;
}

/* Hero — full-bleed photo hero matching the ai-mvp-development pattern */
section.engagement-hero {
    background-image: url('/images/managed-engineering-hero.webp') !important;
    background-position: center 30%;
}

/* Hiring model tabs — segmented pill switcher + card panel replacing the
   plain bordered tab boxes (functionality/JS hooks untouched). */
.engagement-page .price_section {
    background: linear-gradient(180deg, #f7faff 0%, #fff 100%);
}

.engagement-page .techno_tab .nav-tabs {
    display: flex !important;
    justify-content: center;
    max-width: 680px;
    margin: 0 auto;
    padding: 6px;
    background: rgba(1, 64, 136, 0.06);
    border-radius: 999px;
    gap: 4px;
}

.engagement-page .techno_tab .nav-tabs li {
    width: auto;
    flex: 1 1 0;
    border: none;
    background: transparent;
    border-radius: 999px;
    overflow: hidden;
}

.engagement-page .techno_tab .nav-tabs li a {
    margin: 0;
    padding: 15px 10px;
    border-radius: 999px;
    color: #55536a;
    font-weight: 700;
    letter-spacing: -0.2px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.engagement-page .techno_tab .nav-tabs li a::after {
    display: none !important;
}

.engagement-page .techno_tab .nav-tabs li.active a,
.engagement-page .techno_tab .nav-tabs li.active a:hover,
.engagement-page .techno_tab .nav-tabs li.active a:focus {
    background: #014088;
    color: #fff;
    border-bottom: none;
    box-shadow: none;
}

.engagement-page .price_section .tab-content {
    max-width: 1180px;
    margin: 34px auto 0;
    padding: 46px !important;
    background: #fff;
    border-radius: 26px;
    box-shadow: 0 24px 60px rgba(6, 18, 47, 0.08);
}

.engagement-page .price_section .tab_text h3 {
    color: #09090b;
    font-weight: 800;
    letter-spacing: -0.5px;
}

.engagement-page .price_section .tab_image img {
    border-radius: 18px;
}

/* Lifecycle accordion — card panels with a themed icon header replacing
   the flat orange bars (functionality/JS hooks untouched). */
.engagement-page .lifecycle_section .col-md-4 {
    margin-bottom: 26px;
}

.engagement-page .accordian_box {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 16px 40px rgba(6, 18, 47, 0.08);
}

.engagement-page .accordian_box h3 {
    background: #014088;
    padding: 20px 24px;
    font-size: 19px;
    font-weight: 800;
}

.engagement-page .accordian_box .panel-heading {
    padding: 16px 24px;
}

.engagement-page .accordian_box .panel-body {
    padding: 0 24px 20px;
}

/* Row divider: hidden by default, only shown on the panel that's open */
.engagement-page .accordian_box .panel-default {
    border-bottom: 1px solid transparent;
    transition: border-color 0.25s ease;
    border-right: 0px;
    border-left: 0px;;
}

.engagement-page .accordian_box .panel-default:has(.panel-collapse.in) {
    border-bottom-color: rgba(1, 64, 136, 0.18);
}

/* Methodologies — icon feature rows (replaces boxy engage-card grid) */
.engage-models {
    padding: 90px 0;
    background: #fff;
}

.engage-model-list {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    max-width: 1180px;
    margin: 0 auto;
}

.engage-model-item {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    align-items: flex-start;
    gap: 18px;
    padding: 4px 32px;
    border-left: 1px solid rgba(1, 64, 136, 0.14);
    transition: transform 0.3s ease;
}

.engage-model-list .engage-model-item:first-child {
    border-left: none;
    padding-left: 4px;
}

.engage-model-list .engage-model-item:last-child {
    padding-right: 4px;
}

.engage-model-item:hover {
    transform: translateY(-4px);
}

.engage-model-icon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(1, 64, 136, 0.08);
    color: #014088;
    font-size: 24px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.engage-model-item:hover .engage-model-icon {
    background: #014088;
    color: #fff;
}

.engage-model-tag {
    display: inline-flex;
    color: #014088;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.engage-model-content h3 {
    margin: 4px 0 4px;
    color: #09090b;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.3px;
}

.engage-model-content > p {
    margin: 0;
    color: #55536a;
    font-size: 17px;
    line-height: 1.7;
}

.engage-model-points {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 6px;
}

.engage-model-points span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border-radius: 999px;
    background: rgba(1, 64, 136, 0.06);
    color: #06122f;
    font-size: 15px;
    font-weight: 600;
}

.engage-model-points i {
    color: #014088;
    font-size: 11px;
}

@media (max-width: 991px) {
    .engage-model-list {
        flex-direction: column;
    }

    .engage-model-item {
        flex: none;
        padding: 32px 4px;
        border-left: none;
        border-top: 1px solid rgba(1, 64, 136, 0.14);
    }

    .engage-model-list .engage-model-item:first-child {
        padding-left: 4px;
        border-top: 1px solid rgba(1, 64, 136, 0.14);
    }

    .engage-model-list .engage-model-item:last-child {
        padding-right: 4px;
        border-bottom: 1px solid rgba(1, 64, 136, 0.14);
    }

    .engagement-page .techno_tab .nav-tabs {
        max-width: 100%;
    }

    .engagement-page .price_section .tab-content {
        padding: 30px !important;
    }
}

@media (max-width: 767px) {
    .engage-models {
        padding: 55px 0;
    }

    .engagement-page .techno_tab .nav-tabs {
        flex-direction: column;
        border-radius: 18px;
    }

    .engagement-page .techno_tab .nav-tabs li a {
        padding: 12px 10px;
    }

    .engagement-page .accordian_box h3 {
        font-size: 17px;
    }
}

/* =========================================================
   Asset Tokenization page (asset-tokenization.astro) — scoped
   under .asset-tokenization-page
   ========================================================= */
.asset-tokenization-page .mvpflow-heading.text-center {
    max-width: none;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.asset-tokenization-page .mvpflow-heading.text-center p {
    margin-left: auto;
    margin-right: auto;
}

/* Hero — full-bleed photo hero matching the ai-mvp-development pattern */
section.asset-tokenization-hero {
    background-image: url('/images/asset-tokenization-hero.webp') !important;
    background-position: center;
}

/* Comprehensive Solutions — icon feature cards replacing the plain
   card_logo service boxes */
.at-solutions {
    padding: 90px 0;
    background: #fff;
}

.at-solutions-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 26px;
    margin: 10px 0 46px;
}

.at-solution-card {
    padding: 36px 30px;
    background: #fff;
    border: 1px solid rgba(35, 24, 82, 0.08);
    border-radius: 18px;
    box-shadow: 0 14px 45px rgba(57, 40, 105, 0.06);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.at-solution-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 55px rgba(57, 40, 105, 0.14);
    border-color: rgba(1, 64, 136, 0.25);
}

.at-solution-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    margin-bottom: 22px;
    border-radius: 16px;
    background: rgba(1, 64, 136, 0.08);
    color: #014088;
    font-size: 24px;
}

.at-solution-card h4 {
    margin: 0 0 12px;
    color: #09090b;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: -0.3px;
}

.at-solution-card p {
    margin: 0;
    color: #55536a;
    font-size: 17px;
    line-height: 1.75;
}

/* Real-World Asset Tokenization story — accent panel replacing the
   plain text block */
.at-story {
    padding: 90px 0;
    background: linear-gradient(180deg, #f7faff 0%, #fff 100%);
}

.at-story-panel {
    position: relative;
    
    margin: 10px auto 40px;
    padding: 46px 50px;
    background: #fff;
    border-left: 4px solid #014088;
    border-radius: 4px 22px 22px 4px;
    box-shadow: 0 20px 55px rgba(6, 18, 47, 0.08);
}

.at-story-panel p {
    margin: 0 0 18px;
    color: #3f3d55;
    font-size: 17px;
    line-height: 1.85;
}

.at-story-panel p:last-child {
    margin-bottom: 0;
}

/* Business Benefits — icon-topped panel grid replacing the bordered
   conversational-ai-platform-content boxes */
.at-benefits {
    padding: 90px 0;
    background: #fff;
}

.at-benefits-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
    margin-top: 50px;
}

.at-benefit-card {
    flex: 1 1 250px;
    max-width: 290px;
    padding: 25px 17px;
    background: #fff;
    border: 1px solid rgba(1, 64, 136, 0.12);
    border-radius: 18px;
    box-shadow: 0 14px 40px rgba(57, 40, 105, 0.06);
    transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.at-benefit-card:hover {
    background: #014088;
    border-color: #014088;
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(1, 64, 136, 0.22);
}

.at-benefit-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    margin-bottom: 18px;
    border-radius: 50%;
    background: rgba(1, 64, 136, 0.08);
    color: #014088;
    font-size: 20px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.at-benefit-card:hover .at-benefit-icon {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

.at-benefit-card h5 {
    margin: 0 0 10px;
    color: #09090b;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: -0.2px;
    transition: color 0.3s ease;
}

.at-benefit-card:hover h5 {
    color: #fff;
}

.at-benefit-card p {
    margin: 0;
    color: #55536a;
    font-size: 17px;
    line-height: 1.7;
    transition: color 0.3s ease;
}

.at-benefit-card:hover p {
    color: rgba(255, 255, 255, 0.85);
}

/* Process — connected icon cards replacing the plain service_box grid */
.at-process {
    padding: 90px 0;
    background: linear-gradient(180deg, #fff 0%, #f7faff 100%);
}

.at-process-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
    margin: 14px 0 46px;
}

.at-process-card {
    position: relative;
    padding: 32px 28px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid rgba(35, 24, 82, 0.08);
    box-shadow: 0 14px 40px rgba(57, 40, 105, 0.06);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.at-process-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(57, 40, 105, 0.14);
}

.at-process-top {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}

.at-process-icon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: rgba(1, 64, 136, 0.08);
    color: #014088;
    font-size: 20px;
}

.at-process-num {
    color: #014088;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
}

.at-process-card h4 {
    margin: 0 0 10px;
    color: #09090b;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.2px;
}

.at-process-card p {
    margin: 0;
    color: #55536a;
    font-size: 17px;
    line-height: 1.75;
}

/* Key Modules — left-hand tab list swapping a right-hand detail panel,
   replacing the flat numbered card grid */
.at-modules {
    padding: 90px 0;
    background: linear-gradient(135deg, #021b3d 0%, #014088 65%, #0c5cbc 100%);
}

.at-modules .mvpflow-eyebrow {
    color: rgba(255, 255, 255, 0.85);
}

.at-modules .mvpflow-heading h2 {
    color: #fff;
}

.at-modules .mvpflow-heading p {
    color: rgba(255, 255, 255, 0.78);
}

.at-modules-layout {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 32px;
    align-items: stretch;
    margin-top: 20px;
}

.at-modules-tablist {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 18px;
}

.at-modules-tablink {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    padding: 13px 12px;
    background: transparent;
    border: none;
    border-radius: 12px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 18px;
    font-weight: 500;
    text-align: left;
    letter-spacing: -0.1px;
    cursor: pointer;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.at-modules-tablink-num {
    flex: none;
    color: rgba(255, 255, 255, 0.4);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
    transition: color 0.25s ease;
}

.at-modules-tablink:hover {
    background: rgba(255, 255, 255, 0.07);
    color: #fff;
}

.at-modules-tablink.active {
    background: #fff;
    color: #014088;
}

.at-modules-tablink.active .at-modules-tablink-num {
    color: #014088;
}

.at-modules-panes {
    position: relative;
    min-height: 100%;
    padding: 48px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 22px;
    backdrop-filter: blur(6px);
}

.at-modules-pane {
    display: none;
}

.at-modules-pane.active {
    display: block;
}

.at-modules-pane.at-fade-in {
    animation: atModuleFadeIn 0.5s ease forwards;
}

@keyframes atModuleFadeIn {
    from {
        opacity: 0;
        transform: translateY(16px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.at-module-icon-lg {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin-bottom: 22px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: 26px;
}

.at-modules-pane-num {
    display: block;
    margin-bottom: 10px;
    color: rgba(255, 255, 255, 0.55);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
}

.at-modules-pane h3 {
    margin: 0 0 14px;
    color: #fff;
    font-size: clamp(22px, 2.4vw, 30px);
    font-weight: 800;
    letter-spacing: -0.4px;
}

.at-modules-pane p {
    max-width: 660px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 21px;
    line-height: 1.8;
    font-weight: 500;
}

/* Why Choose Netset — icon-topped panel grid matching Business Benefits */
.at-why {
    padding: 90px 0;
    background: #fff;
}

.at-why-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 2px;
    margin-top: 50px;
    background: rgba(1, 64, 136, 0.1);
    border: 1px solid rgba(1, 64, 136, 0.1);
    border-radius: 20px;
    overflow: hidden;
}

.at-why-card {
    padding: 34px 22px;
    background: #fff;
    text-align: center;
    transition: background-color 0.3s ease, transform 0.3s ease;
}

.at-why-card:hover {
    background: #014088;
    transform: translateY(-4px);
    z-index: 1;
}

.at-why-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 18px;
    border-radius: 50%;
    background: rgba(1, 64, 136, 0.08);
    color: #014088;
    font-size: 22px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.at-why-card:hover .at-why-icon {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

.at-why-card h3 {
    margin: 0 0 8px;
    color: #09090b;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: -0.2px;
    transition: color 0.3s ease;
}

.at-why-card:hover h3 {
    color: #fff;
}

.at-why-card p {
    margin: 0;
    color: #55536a;
    font-size: 17px;
    line-height: 1.7;
    transition: color 0.3s ease;
}

.at-why-card:hover p {
    color: rgba(255, 255, 255, 0.85);
}

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

    .at-process-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .at-modules-layout {
        grid-template-columns: 1fr;
    }

    .at-modules-tablist {
        flex-direction: row;
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 8px;
    }

    .at-modules-tablink {
        flex: none;
        width: auto;
        white-space: nowrap;
    }

    .at-modules-panes {
        padding: 38px;
    }

    .at-why-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .at-story-panel {
        padding: 36px 32px;
    }
}

@media (max-width: 767px) {
    .at-solutions,
    .at-story,
    .at-benefits,
    .at-process,
    .at-modules,
    .at-why {
        padding-top: 55px;
        padding-bottom: 55px;
    }

    .at-solutions-grid,
    .at-process-grid {
        grid-template-columns: 1fr;
    }

    .at-benefit-card {
        flex: 1 1 100%;
        max-width: 420px;
    }

    .at-modules-panes {
        padding: 28px;
    }

    .at-modules-pane h3 {
        font-size: 21px;
    }

    /* Fixed, narrow width (with wrapping label) instead of shrinking
       to full label length — guarantees at least two pills are visible
       at once on phones regardless of how long a given label is,
       hinting there are more to scroll to. */
    .at-modules-tablink {
        width: 135px;
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
        padding: 10px 12px;
        font-size: 13px;
        line-height: 1.25;
        white-space: normal;
    }

    .at-why-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .at-story-panel {
        padding: 30px 24px;
        border-radius: 4px 18px 18px 4px;
    }
}

@media (max-width: 480px) {
    .at-why-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   NFT Development Company page (nft-development-company.astro)
   — scoped under .nft-page
   ========================================================= */
.nft-page .mvpflow-heading.text-center {
    max-width: none;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.nft-page .mvpflow-heading.text-center p {
    margin-left: auto;
    margin-right: auto;
}

/* Hero — full-bleed photo hero matching the ai-mvp-development pattern */
section.nft-development-hero {
    background-image: url('/images/nft-background.webp') !important;
    background-position: center;
}

.nft-hero-trust {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px 28px;
    margin: 28px 0 0;
    padding: 0;
    list-style: none;
}

.nft-hero-trust span {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: rgba(255, 255, 255, 0.88);
    font-size: 14.5px;
    font-weight: 600;
}

.nft-hero-trust i {
    color: #6fb0ff;
    font-size: 15px;
}

.nft-hero-offer {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    max-width: 720px;
    margin: 26px auto 0;
    padding: 14px 22px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    color: #fff;
    font-size: 14.5px;
    line-height: 1.5;
    text-align: left;
}

.nft-hero-offer i {
    flex: none;
    color: #ffb020;
    font-size: 18px;
}

/* NFT development services — simple icon tags */
.nft-services {
    padding: 90px 0 40px;
    background: #fff;
}

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

.nft-service-tag {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 28px 26px;
    background: #f7faff;
    border: 1px solid rgba(1, 64, 136, 0.1);
    border-radius: 16px;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

.nft-service-tag:hover {
    transform: translateY(-4px);
    background: #fff;
    box-shadow: 0 18px 40px rgba(1, 64, 136, 0.12);
}

.nft-service-tag i {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: rgba(1, 64, 136, 0.1);
    color: #014088;
    font-size: 19px;
}

.nft-service-tag h3 {
    margin: 0;
    color: #09090b;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: -0.2px;
}

/* White-label chain grid */
.nft-chains {
    padding: 90px 0;
    background: linear-gradient(180deg, #f7faff 0%, #fff 100%);
}

.nft-chains-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    margin-top: 10px;
}

.nft-chain-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 34px 20px;
    background: #fff;
    border: 1px solid rgba(35, 24, 82, 0.08);
    border-radius: 18px;
    box-shadow: 0 14px 40px rgba(57, 40, 105, 0.06);
    text-align: center;
    text-decoration: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.nft-chain-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(57, 40, 105, 0.14);
    border-color: rgba(1, 64, 136, 0.25);
}

.nft-chain-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(1, 64, 136, 0.08);
    color: #014088;
    font-size: 22px;
}

.nft-chain-card h3 {
    margin: 0;
    color: #09090b;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: -0.2px;
    line-height: 1.4;
}

/* Types of NFT marketplaces */
.nft-types {
    padding: 90px 0;
    background: #fff;
}

.nft-types-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 26px;
    margin: 10px 0 44px;
}

.nft-type-card {
    display: flex;
    flex-direction: column;
    padding: 30px 26px;
    background: #fff;
    border: 1px solid rgba(35, 24, 82, 0.08);
    border-radius: 18px;
    box-shadow: 0 14px 40px rgba(57, 40, 105, 0.06);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.nft-type-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(57, 40, 105, 0.14);
}

.nft-type-media {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    margin-bottom: 18px;
    border-radius: 16px;
    background: rgba(1, 64, 136, 0.06);
}

.nft-type-media img {
    max-width: 34px;
    max-height: 34px;
}

.nft-type-card h3 {
    margin: 0 0 10px;
    color: #09090b;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.2px;
}

.nft-type-card p {
    margin: 0 0 16px;
    color: #55536a;
    font-size: 17px;
    line-height: 1.75;
}

.nft-type-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    color: #014088;
    font-size: 14.5px;
    font-weight: 700;
    text-decoration: none;
}

.nft-type-link:hover {
    text-decoration: underline;
}

/* Why NetSet's white-label solution — checklist grid, reused for the
   intuitive UI split section too */
.nft-why {
    padding: 90px 0;
    background: linear-gradient(180deg, #f7faff 0%, #fff 100%);
}

.nft-checklist {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 32px;
    max-width: 920px;
    margin: 8px auto 0;
}

.nft-checklist--split {
    max-width: none;
    margin: 26px 0 0;
}

.nft-checklist-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.nft-checklist-item i {
    flex: none;
    margin-top: 3px;
    color: #014088;
    font-size: 17px;
}

.nft-checklist-item p {
    margin: 0;
    color: #292741;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.6;
}

/* Split feature sections — media + content (multi-device, intuitive UI) */
.nft-split {
    padding: 90px 0;
    background: #fff;
}

.nft-split-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: center;
}

.nft-split--reverse .nft-split-grid {
    grid-template-columns: 1.1fr 0.9fr;
}

.nft-split-media img {
    width: 100%;
    border-radius: 20px;
}

.nft-split-content h2 {
    margin: 8px 0 18px;
    color: #09090b;
    font-size: clamp(26px, 3vw, 36px);
    font-weight: 800;
    letter-spacing: -0.8px;
    line-height: 1.2;
}

.nft-split-content p {
    margin: 0;
    color: #55536a;
    font-size: 17px;
    line-height: 1.8;
}

/* Customize your NFT marketplace */
.nft-customize {
    padding: 90px 0;
    background: #fff;
}

.nft-customize-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 26px;
    margin-top: 10px;
}

.nft-customize-card {
    padding: 36px 30px;
    background: #f7faff;
    border: 1px solid rgba(1, 64, 136, 0.1);
    border-radius: 18px;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

.nft-customize-card:hover {
    transform: translateY(-6px);
    background: #fff;
    box-shadow: 0 22px 55px rgba(57, 40, 105, 0.14);
}

.nft-customize-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    margin-bottom: 22px;
    border-radius: 16px;
    background: rgba(1, 64, 136, 0.08);
    color: #014088;
    font-size: 24px;
}

.nft-customize-card h3 {
    margin: 0 0 12px;
    color: #09090b;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: -0.3px;
}

.nft-customize-card p {
    margin: 0;
    color: #55536a;
    font-size: 17px;
    line-height: 1.7;
}

@media (max-width: 991px) {
    .nft-services-grid {
        grid-template-columns: 1fr;
    }

    .nft-chains-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .nft-types-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .nft-customize-grid {
        grid-template-columns: 1fr;
    }

    .nft-split-grid,
    .nft-split--reverse .nft-split-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .nft-split--reverse .nft-split-content {
        order: -1;
    }
}

@media (max-width: 767px) {
    .nft-services,
    .nft-chains,
    .nft-types,
    .nft-why,
    .nft-split,
    .nft-customize {
        padding-top: 55px;
        padding-bottom: 55px;
    }

    .nft-chains-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .nft-types-grid {
        grid-template-columns: 1fr;
    }

    .nft-checklist {
        grid-template-columns: 1fr;
    }

    .nft-hero-offer {
        text-align: left;
    }
}

@media (max-width: 480px) {
    .nft-chains-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Case Studies listing page (case-studies/index.astro)
   — scoped under .case-studies-page
   ========================================================= */
section.case-studies-hero {
    padding-bottom: 90px;
}

/* Category filter tabs — segmented pill switcher matching the
   engagement-model / ai-mvp hiring-model tabs */
.case-studies-page .tab_label {
    margin-bottom: 50px;
}

.case-studies-page .tab_label ul.nav-tabs {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 4px;
    margin: 0;
    padding: 6px;
    background: rgba(1, 64, 136, 0.06);
    border-radius: 999px;
}

.case-studies-page .tab_label ul.nav-tabs li {
    border-right: none;
    padding: 0;
}

.case-studies-page .tab_label ul.nav-tabs li a {
    margin: 0;
    padding: 12px 24px;
    border: none !important;
    border-radius: 999px;
    color: #55536a;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.3px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.case-studies-page .tab_label ul.nav-tabs li a:hover,
.case-studies-page .tab_label ul.nav-tabs li a:focus {
    background: rgba(1, 64, 136, 0.1) !important;
    color: #014088;
}

.case-studies-page .tab_label ul.nav-tabs li.active a,
.case-studies-page .tab_label ul.nav-tabs li.active a:hover,
.case-studies-page .tab_label ul.nav-tabs li.active a:focus {
    background: #014088 !important;
    color: #fff;
}

/* Card grid spacing */
.case-studies-page .newcasestudy_section {
    padding-top: 90px;
}

.case-studies-page .newcasestudy_padding .row {
    margin-left: -14px;
    margin-right: -14px;
}

.case-studies-page .newcasestudy_padding .row > div {
    padding-left: 14px;
    padding-right: 14px;
}

/* Card redesign — clean white card with a framed photo, badge logo and
   an animated CTA, replacing the full-bleed dark-overlay tile */
.case-studies-page .casestudy_box {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid rgba(35, 24, 82, 0.08);
    border-radius: 20px;
    box-shadow: 0 14px 40px rgba(57, 40, 105, 0.07);
    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.4s ease, border-color 0.4s ease;
}

.case-studies-page .casestudy_box:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 65px rgba(1, 64, 136, 0.18);
    border-color: rgba(1, 64, 136, 0.2);
}

.case-studies-page .casestudy_box:before {
    display: none;
}

.case-studies-page .casestudy_image {
    position: relative;
    left: auto;
    top: auto;
    height: 220px;
    width: 100%;
    flex: none;
    overflow: hidden;
    border-radius: 20px 20px 0 0;
    transform: none !important;
}

.case-studies-page .casestudy_image::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 65%;
    background: linear-gradient(180deg, rgba(3, 10, 26, 0) 0%, rgba(3, 10, 26, 0.72) 100%);
    pointer-events: none;
}

.case-studies-page .casestudy_image img {
    filter: none !important;
    transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.case-studies-page .casestudy_box:hover .casestudy_image img {
    transform: scale(1.09);
    filter: none !important;
}

.case-studies-page .casestudy_logo {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    min-height: auto;
    margin: -26px 20px 0;
    padding: 9px 16px;
    background: #061029;
    border-radius: 12px;
    box-shadow: 0 12px 26px rgba(3, 10, 26, 0.28);
    font-size: 13px;
}

.case-studies-page .casestudy_logo img {
    max-width: 100px;
    max-height: 26px;
    width: auto;
    height: auto;
    -webkit-filter: none;
    filter: none;
}

.case-studies-page .casestudy_logo h2.casetudy_name {
    margin: 0;
    color: #fff;
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: 0.2px;
    line-height: 1.3;
}

.case-studies-page .casestudy_logo h4 {
    margin: 0 0 0 4px;
    color: #fff;
    font-size: 12.5px;
    font-weight: 700;
}

.case-studies-page .casestudy_box > p {
    position: static;
    z-index: auto;
    min-height: 50px;
    margin: 0;
    padding: 25px 22px 0;
    color: #09090b;
    font-size: 16.5px;
    font-weight: 700;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.case-studies-page .casestudy_author {
    display: none;
}

.case-studies-page .casestudy_play_video {
    position: static;
    z-index: auto;
    margin-top: 0;
    padding: 30px 22px 26px;
    color: inherit;
    bottom: auto;
}

.case-studies-page .casestudy_play_video a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 2px solid #014088 !important;
    padding: 9px 18px !important;
    border-radius: 999px;
    color: #014088 !important;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 0 !important;
    transition: background-color 0.3s ease, color 0.3s ease, gap 0.3s ease;
}

.case-studies-page .casestudy_play_video a::after {
    content: "\2192";
    transition: transform 0.3s ease;
}

.case-studies-page .casestudy_play_video a:hover {
    background: #014088 !important;
    color: #fff !important;
    font-weight: 700;
    gap: 12px;
}

@media (max-width: 767px) {
    .case-studies-page .newcasestudy_section {
        padding-top: 55px;
    }

    .case-studies-page .tab_label ul.nav-tabs {
        display: flex;
        flex-wrap: nowrap;
        width: 100%;
        overflow-x: auto;
        justify-content: flex-start;
        border-radius: 14px;
        scrollbar-width: none;
        -ms-overflow-style: none;
        -webkit-overflow-scrolling: touch;
    }

    .case-studies-page .tab_label ul.nav-tabs::-webkit-scrollbar {
        display: none;
        height: 0;
    }

    .case-studies-page .tab_label ul.nav-tabs li {
        flex: 0 0 auto;
        width: auto;
    }

    .case-studies-page .tab_label ul.nav-tabs li a {
        white-space: nowrap;
        padding: 10px 18px;
    }

    /* Restore the 25px logo-to-heading gap — a legacy rule in
       responsive.min.css (shared by the old dark-card pages) is more
       specific and collapses this to 0 on mobile otherwise. */
    .case-studies-page .casestudy_box > p {
        padding: 25px 22px 0 !important;
    }

    .case-studies-page .cs-index-box.casestudty_slider_sec.case-study-main-box.box-fixed-height .casestudy_box {
        min-height: 390px !important;
    }

    .case-studies-page .casestudy_play_video {
        padding-top: 14px;
    }
}

@media (max-width:600px){
        .technologies-area .panel-default a {
    position: relative;
    padding-right: 10px;
}

.technologies-area .panel-default a::after {
    top: 0;
    position: absolute;
    right: -15px;
}
}

/* ============================================================
   Startup page "process list" (.our_process_list_section) -
   only used on startup.astro.
   1) .container.bg_Container::before is a decorative fixed,
      negative z-indexed green backdrop meant to stay hidden
      behind the section's own background. Below 1024px it pokes
      out ~28px past the container on both sides (fixed elements
      aren't confined by their ancestor's normal-flow bounds),
      showing as unwanted green bars flanking the icons. Desktop
      isn't affected, so just hide it at tablet/mobile widths.
   2) The section has no bottom padding, so the last process item
      (process4) butts straight into the footer with zero gap.
   ============================================================ */
.our_process_list_section {
    padding-bottom: 70px;
    overflow: hidden;
    position: relative;
}

.our_process_list_section::before,
.our_process_list_section::after {
    content: "";
    position: absolute;
    top: -150px;
    height: calc(100% + 300px);
    background: #f5f5f5;
    z-index: 999;
    pointer-events: none;
}

.our_process_list_section::before {
    left: 0;
}

.our_process_list_section::after {
    right: 0;
}

.our_process_list_section .process_list {
    position: relative;
}

.our_process_list_section .process_list::before {
    content: "";
    position: absolute;
    left: -100vw;
    right: -100vw;
    top: 100%;
    height: 70px;
    background: #f5f5f5;
    z-index: 999;
    pointer-events: none;
}

@media (max-width: 767px) {
    .our_process_list_section::before,
    .our_process_list_section::after {
        width: 0;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .our_process_list_section::before,
    .our_process_list_section::after {
        width: min(calc((100vw - 750px) / 2 + 90px), 150px);
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .our_process_list_section::before,
    .our_process_list_section::after {
        width: min(calc((100vw - 970px) / 2 + 90px), 150px);
    }
}

@media (min-width: 1200px) {
    .our_process_list_section::before,
    .our_process_list_section::after {
        width: min(calc((100vw - 1170px) / 2 + 90px), 150px);
    }
}

/* ===================== Awards & Recognition ===================== */
.awards-section {
    position: relative;
    overflow: hidden;
    padding: 90px 20px 80px;
    background: linear-gradient(180deg, #01142e 0%, #012a5e 45%, #014088 100%);
    font-family: "Product Sans", Arial, sans-serif;
    isolation: isolate;
}

.awards-glow {
    position: absolute;
    left: 50%;
    bottom: -22%;
    width: min(1400px, 140vw);
    height: 620px;
    transform: translateX(-50%);
    background: radial-gradient(50% 50% at 50% 100%, rgba(110, 190, 255, 0.55) 0%, rgba(46, 130, 226, 0.28) 35%, rgba(1, 64, 136, 0) 72%);
    filter: blur(6px);
    pointer-events: none;
    z-index: 0;
}

.awards-section::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 64px 64px;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, transparent 45%, #000 100%);
    mask-image: linear-gradient(180deg, transparent 0%, transparent 45%, #000 100%);
    pointer-events: none;
    z-index: 0;
}

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

.awards-head {
    max-width: 720px;
    margin: 0 auto 48px;
    text-align: center;
}

.awards-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    padding: 6px 16px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.06);
    color: #8fc3ff;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.awards-eyebrow i {
    color: #4fd1c5;
    font-size: 12px;
}

.awards-title {
    margin: 0 0 16px;
    color: #fff;
    font-size: 42px;
    font-weight: 700;
    line-height: 1.2;
}

.awards-subtitle {
    margin: 0 auto;
    max-width: 620px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 17px;
    line-height: 1.6;
}

.awards-slider-wrap {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
}

.awards-swiper {
    flex: 1;
    min-width: 0;
    padding: 22px 4px 20px;
}

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

.awards-nav {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.25);
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    transition: background 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}

.awards-nav:hover {
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.45);
    transform: translateY(-2px);
}

.awards-nav.swiper-button-disabled {
    opacity: 0.35;
    cursor: default;
    transform: none;
}

.award-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 30px 20px;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: transparent;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: none;
    transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease, background 0.4s ease;
    text-align: center;
}

.award-card:hover {
    transform: translateY(-4px);
    border-color: rgba(255, 255, 255, 0.35);
    background: rgba(255, 255, 255, 0.05);
    box-shadow: 0 20px 40px rgba(1, 15, 40, 0.35);
}

/* Plain award badge images (Clutch, RightFirms, GoodFirms, ...) */
.award-card-img {
    width: 100%;
    max-width: 190px;
    height: auto;
    object-fit: contain;
}

/* Clutch - Smart Contract & Blockchain awards */
.award-card-img--sm {
    max-width: 150px;
}

/* itrate.co badge */
.award-card-badge--itrate {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 180px;
    height: 180px;
    border-radius: 12px;
    background: #fff;
    padding: 18px;
}

.award-card-badge--itrate img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* DesignRush badge */
.award-card-badge--designrush {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 220px;
    height: 170px;
    overflow: hidden;
}

.award-card-badge--designrush img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

@media (max-width: 991px) {
    .awards-title {
        font-size: 32px;
    }
}

@media (max-width: 767px) {
    .awards-section {
        padding: 70px 16px 60px;
    }

    .awards-title {
        font-size: 26px;
    }

    .awards-subtitle {
        font-size: 15.5px;
    }

    .awards-slider-wrap {
        flex-wrap: wrap;
        justify-content: center;
        gap: 14px;
    }

    .awards-swiper {
        order: 1;
        flex: 0 0 100%;
        width: 100%;
    }

    .awards-nav {
        order: 2;
        width: 44px;
        height: 44px;
    }

    .award-card {
        padding: 22px 16px;
    }

    .award-card-img {
        max-width: 150px;
    }
}