/* ============ FONT FACES ============ */
@font-face {
    font-family: 'Aeonik';
    src: url('../devminds-nw-km/Aeonik-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aeonik';
    src: url('../devminds-nw-km/Aeonik-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

/* ============ GLOBAL VARIABLES ============ */
:root {
    --devminds-nw-km-font: 'Aeonik', sans-serif;

    --devminds-nw-km-color-white: #FFFFFF;
    --devminds-nw-km-color-blue: #264CBE;
    --devminds-nw-km-color-dark: #2A2A2A;
    --devminds-nw-km-color-gray: #4A4A4A;
    --devminds-nw-km-color-light-bg: #F4F6FC;
    --devminds-nw-km-color-border: rgba(0, 0, 0, 0.1);
    --devminds-nw-km-color-muted: #AAAAAA;
    --devminds-nw-km-color-transparent: transparent;
    --devminds-nw-km-color-navy: #0E193C;
    --devminds-nw-km-color-dot-inactive: #DCDCDC;
    --devminds-nw-km-color-testi-inactive: #C0D0FF;
    --devminds-nw-km-color-footer-link: #2A2A2ACC;
}

/* ============ BASE PAGE SCOPE ( merged ) ============ */
.devminds-nw-km-page {
    margin: 0;
    padding: 0;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-dark);
}

.devminds-nw-km-page * {
    box-sizing: border-box;
    font-family: var(--devminds-nw-km-font);
}

/* ============ GLOBAL TYPOGRAPHY ============ */
.devminds-nw-km-page h1,
.devminds-nw-km-page h2,
.devminds-nw-km-page h3,
.devminds-nw-km-page h4,
.devminds-nw-km-page h5,
.devminds-nw-km-page h6 {
    font-family: var(--devminds-nw-km-font);
}

.devminds-nw-km-page h1 { font-weight: 500; font-size: 80px; line-height: 1.1; }
.devminds-nw-km-page h2 { font-weight: 400; font-size: 48px; line-height: 57.6px; }
.devminds-nw-km-page h3 { font-weight: 400; font-size: 40px; line-height: 48px; }
.devminds-nw-km-page h4 { font-weight: 400; font-size: 32px; line-height: 41.6px; }
.devminds-nw-km-page h5 { font-weight: 500; font-size: 24px; line-height: 1.3; }
.devminds-nw-km-page h6 { font-weight: 500; font-size: 20px; line-height: 24px; }

/* ============ TEXT UTILITY CLASSES ============ */
.devminds-nw-km-trusted-text {
    font-family: var(--devminds-nw-km-font);
    font-weight: 400;
    font-size: 16px;
}

.devminds-nw-km-hero-subtext {
    font-family: var(--devminds-nw-km-font);
    font-weight: 400;
    font-size: 16px;
}

.devminds-nw-km-section-subtext {
    font-family: var(--devminds-nw-km-font);
    font-weight: 400;
    font-size: 18px;
}

.devminds-nw-km-btn-text {
    font-family: var(--devminds-nw-km-font);
    font-weight: 500;
    font-size: 16px;
}

/* ===================================================== NAVBAR ======================================================= */

.devminds-nw-km-header {
    background-color: var(--devminds-nw-km-color-white);
    max-width: 1280px;
    width: calc(100% - 48px);
    margin: 0;
    border-radius: 60px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    position: absolute;
    top: 32px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
}

.devminds-nw-km-header-inner {
    padding: 12px 12px 12px 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

/* Logo */
.devminds-nw-km-logo {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.devminds-nw-km-logo img {
    max-height: 42px;
    width: auto;
    display: block;
}

/* Desktop Menu */
.devminds-nw-km-nav {
    flex-grow: 1;
    display: flex;
    justify-content: center;
}

.devminds-nw-km-menu {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 32px;
    margin: 0;
    padding: 0;
}

.devminds-nw-km-menu li {
    position: relative;
    margin-top: 5px;
}

.devminds-nw-km-menu li a {
    text-decoration: none;
    color: #1a1a2e;
    font-family: var(--devminds-nw-km-font);
    font-weight: 400;
    font-size: 15px;
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    border-radius: 6px;
    transition: color 0.3s ease;
}

/* Desktop chevron */
.devminds-nw-km-menu li.menu-item-has-children > a::after {
    content: '';
    width: 8px;
    height: 8px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg);
    margin-top: -4px;
    transition: transform 0.3s ease, margin-top 0.3s ease, border-color 0.3s ease;
}

.devminds-nw-km-menu li.menu-item-has-children:hover > a::after {
    transform: rotate(225deg);
    margin-top: 4px;
}

.devminds-nw-km-menu .sub-menu {
    list-style: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--devminds-nw-km-color-white);
    min-width: 200px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    padding: 8px 8px;
    margin: 25px 0 0 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: all 0.2s ease;
    height: auto;
    max-height: none;
    overflow: visible;
    z-index: 20;
    gap: 0;
}

.devminds-nw-km-menu li.menu-item-has-children:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.devminds-nw-km-menu .sub-menu li a {
    padding: 10px 20px;
    font-size: 14px;
}

.devminds-nw-km-menu .sub-menu li a:hover {
    background-color: #264cbe29;
}

/* Navbar button (desktop) */
.devminds-nw-km-navbar-btn {
    background-color: var(--devminds-nw-km-color-blue);
    color: var(--devminds-nw-km-color-white);
    text-decoration: none;
    padding: 12px 24px;
    border-radius: 30px;
    white-space: nowrap;
    flex-shrink: 0;
    display: inline-block;
    transition: background-color 0.2s ease;
}

.devminds-nw-km-navbar-btn:hover {
    background-color: #1d3a94;
    color: var(--devminds-nw-km-color-white);
}

/* ---------- HAMBURGER (hidden on desktop) ---------- */
.devminds-nw-km-hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 32px;
    height: 32px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
}

.devminds-nw-km-hamburger span {
    display: block;
    width: 100%;
    height: 2px;
    background-color: var(--devminds-nw-km-color-dark);
    border-radius: 2px;
    transition: transform 0.3s ease, opacity 0.3s ease, background-color 0.3s ease;
}

/* When menu is open, hamburger becomes an X — lines rotate/fade instead of being swapped out */
.devminds-nw-km-hamburger.devminds-nw-km-active {
    z-index: 1002;
    position: relative;
}

.devminds-nw-km-hamburger.devminds-nw-km-active span {
    background-color: var(--devminds-nw-km-color-white);
}

.devminds-nw-km-hamburger.devminds-nw-km-active span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.devminds-nw-km-hamburger.devminds-nw-km-active span:nth-child(2) {
    opacity: 0;
}

.devminds-nw-km-hamburger.devminds-nw-km-active span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.devminds-nw-km-navbar-btn.devminds-nw-km-btn-text.devminds-nw-km-navbar-btn-header {
    margin-left: auto;
}


/* ---------- MOBILE MENU (animated diagonal panels) ---------- */

.devminds-nw-km-mobile-menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1001;
    visibility: hidden;
    pointer-events: none;
}

.devminds-nw-km-mobile-menu.devminds-nw-km-active {
    visibility: visible;
    pointer-events: auto;
}

/* Two full-screen panels that slide in diagonally from the top-right */
.devminds-nw-km-mobile-panel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    clip-path: circle(0% at 100% 0%);
    transition: clip-path 0.7s cubic-bezier(0.65, 0, 0.35, 1);
}

.devminds-nw-km-panel-blue {
    background-color: var(--devminds-nw-km-color-blue);
    transition-delay: 0s;
}

.devminds-nw-km-panel-dark {
    background-color: var(--devminds-nw-km-color-dark); 
    transition-delay: 0.15s;
}

/* When closing, reverse the stacking order: dark retreats first, then blue */
.devminds-nw-km-mobile-menu.devminds-nw-km-closing .devminds-nw-km-panel-blue {
    transition-delay: 0.15s;
}

/* When closing, skip the staggered delays entirely — everything fades out together, quickly */
.devminds-nw-km-mobile-menu.devminds-nw-km-closing .devminds-nw-km-mobile-menu-list > li,
.devminds-nw-km-mobile-menu.devminds-nw-km-closing .devminds-nw-km-mobile-btn {
    transition-delay: 0s !important;
    transition-duration: 0.2s !important;
}

.devminds-nw-km-mobile-menu.devminds-nw-km-closing .devminds-nw-km-panel-dark {
    transition-delay: 0s;
}

.devminds-nw-km-mobile-menu.devminds-nw-km-panels-in .devminds-nw-km-mobile-panel {
    clip-path: circle(150% at 100% 0%);
}

/* Content (logo, nav, button) sits above both panels */
.devminds-nw-km-mobile-menu-content {
    position: relative;
    z-index: 2;
    height: 100%;
    padding: 24px;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.devminds-nw-km-mobile-menu-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
}

.devminds-nw-km-mobile-logo {
    max-height: 36px;
    width: auto;
    filter: brightness(0) invert(1); /* white logo on the dark panel */
}

.devminds-nw-km-mobile-close {
    background: none;
    border: none;
    font-size: 30px;
    line-height: 1;
    cursor: pointer;
    color: var(--devminds-nw-km-color-white);
    padding: 0;
}

.devminds-nw-km-mobile-nav {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.devminds-nw-km-mobile-menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: center;
    width: 100%;
}

.devminds-nw-km-mobile-menu-list > li {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 0.35s ease, transform 0.35s ease;
    margin-bottom: 22px;
}

/* Stagger: each successive item is revealed slightly later than the one before */
.devminds-nw-km-mobile-menu-list > li:nth-child(1) { transition-delay: 0.35s; }
.devminds-nw-km-mobile-menu-list > li:nth-child(2) { transition-delay: 0.42s; }
.devminds-nw-km-mobile-menu-list > li:nth-child(3) { transition-delay: 0.49s; }
.devminds-nw-km-mobile-menu-list > li:nth-child(4) { transition-delay: 0.56s; }
.devminds-nw-km-mobile-menu-list > li:nth-child(5) { transition-delay: 0.63s; }
.devminds-nw-km-mobile-menu-list > li:nth-child(6) { transition-delay: 0.7s; }

.devminds-nw-km-mobile-menu.devminds-nw-km-items-in .devminds-nw-km-mobile-menu-list > li {
    opacity: 1;
    transform: translateY(0);
}

.devminds-nw-km-mobile-menu-list li a {
    position: relative;
    display: inline-block;
    padding: 6px 4px;
    text-decoration: none;
    color: rgba(255, 255, 255, 0.55);
    font-family: var(--devminds-nw-km-font);
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    transition: color 0.25s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Custom arrow — appears right next to the text, not far off to the side */
.devminds-nw-km-mobile-menu-list li.menu-item-has-children > a::after {
    content: '';
    width: 8px;
    height: 8px;
    border-right: 2px solid rgba(255, 255, 255, 0.6);
    border-bottom: 2px solid rgba(255, 255, 255, 0.6);
    transform: rotate(45deg);
    transition: transform 0.3s ease;
    margin-top: -4px;
}

/* Arrow flips when submenu is open */
.devminds-nw-km-mobile-menu-list li.devminds-nw-km-submenu-open > a::after {
    transform: rotate(-135deg);
}

/* Strike-line hover effect — a horizontal white line sweeps across the middle of the text */
.devminds-nw-km-mobile-menu-list li a::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: var(--devminds-nw-km-color-white);
    transform: translateY(-50%);
    transition: width 0.3s ease;
}

.devminds-nw-km-mobile-menu-list li a:hover,
.devminds-nw-km-mobile-menu-list li a:focus {
    color: var(--devminds-nw-km-color-white);
}

.devminds-nw-km-mobile-menu-list li a:hover::before,
.devminds-nw-km-mobile-menu-list li a:focus::before {
    width: 100%;
}

.devminds-nw-km-mobile-menu-list .sub-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    height: auto !important;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.35s ease, opacity 0.3s ease, margin 0.35s ease;

    /* Override the old theme's generic .sub-menu rule which pushes it off-screen and sets height:0 */
    position: static;
    left: auto;
    top: auto;
    z-index: auto;
    transform: none;
    min-width: 0;
    background-color: transparent;
}

.devminds-nw-km-mobile-menu-list li.devminds-nw-km-submenu-open > .sub-menu {
    max-height: 400px;
    opacity: 1;
    margin: 12px 0 0 0;
}

.devminds-nw-km-mobile-menu-list .sub-menu li a {
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.4);
    visibility: visible;
}

.devminds-nw-km-mobile-btn {
    align-self: center;
    text-align: center;
    margin-top: 20px;
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 0.35s ease, transform 0.35s ease;
    transition-delay: 0.78s;
}

.devminds-nw-km-mobile-menu.devminds-nw-km-items-in .devminds-nw-km-mobile-btn {
    opacity: 1;
    transform: translateY(0);
}

/* Hide the existing theme's auto-injected dropdown arrow — we use our own custom arrow instead */
.devminds-nw-km-page .down-arrow {
    display: none !important;
}

/* When mobile menu is open, hide everything in the header except the hamburger/X button */
body.devminds-nw-km-menu-open .devminds-nw-km-header {
    background-color: transparent !important;
    box-shadow: none !important;
    z-index: 1002;
}

body.devminds-nw-km-menu-open .devminds-nw-km-header-inner > *:not(.devminds-nw-km-hamburger) {
    visibility: hidden !important;
}

html.devminds-nw-km-menu-open,
body.devminds-nw-km-menu-open {
    overflow: hidden;
    height: 100%;
    position: fixed;
    width: 100%;
}

/* ===== Active page: top-level menu (Services etc.) ===== */
.devminds-nw-km-menu > li.current-menu-item > a,
.devminds-nw-km-menu > li.current-menu-ancestor > a {
    color: var(--devminds-nw-km-color-blue);
}

/* ===== Active page: dropdown item ===== */
.devminds-nw-km-menu .sub-menu li.current-menu-item > a {
    background-color: #264cbe29; /* same as hover */
    color: #1a1a2e;              /* normal text color, blue */
}

/* ===== Mobile menu active ===== */
.devminds-nw-km-mobile-menu-list .current-menu-item > a,
.devminds-nw-km-mobile-menu-list .current-menu-ancestor > a {
    color: #ffffff;
}

/* ===================================================== HERO SECTION ====================================================== */

.devminds-nw-km-hero {
    background-color: var(--devminds-nw-km-color-blue);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
    padding: 155px 24px 0;
}

.devminds-nw-km-hero-inner {
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    position: relative;
    z-index: 2;
}

/* ---------- LEFT SIDE ---------- */
.devminds-nw-km-hero-left {
    flex: 0 0 46%;
    max-width: 46%;
}

.devminds-nw-km-hero-trusted {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 30px;
    padding: 8px 18px 8px 8px;
    margin-bottom: 20px;
    backdrop-filter: blur(10px);
}

.devminds-nw-km-hero-trusted-img {
    height: 28px;
    width: auto;
    display: block;
}

.devminds-nw-km-hero-trusted .devminds-nw-km-trusted-text {
    color: var(--devminds-nw-km-color-white);
}

.devminds-nw-km-hero-title {
    color: var(--devminds-nw-km-color-white);
    margin-bottom: 24px;
}

.devminds-nw-km-hero-subtext {
    color: var(--devminds-nw-km-color-white);
    margin: 24px 0 32px 0;
    max-width: 580px;
}

.devminds-nw-km-hero-buttons {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.devminds-nw-km-hero-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 16px 35px;
    border-radius: 30px;
    text-decoration: none;
    white-space: nowrap;
    transition: all 0.2s ease;
}

.devminds-nw-km-hero-btn-primary {
    background-color: var(--devminds-nw-km-color-white);
    color: var(--devminds-nw-km-color-blue);
}

.devminds-nw-km-hero-btn-primary:hover {
    background-color: #eef1fb;
    color: var(--devminds-nw-km-color-blue);
}

.devminds-nw-km-hero-btn-secondary {
    background-color: rgba(255, 255, 255, 0.15);
    color: var(--devminds-nw-km-color-white);
    border: 1px solid rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(10px);
}

.devminds-nw-km-hero-btn-secondary:hover {
    background-color: rgba(255, 255, 255, 0.25);
    color: var(--devminds-nw-km-color-white);
}

/* ---------- RIGHT SIDE ---------- */
.devminds-nw-km-hero-right {
    flex: 0 0 54%;
    max-width: 54%;
    position: relative;
    min-height: 640px;
    height: 640px;
    overflow: visible;
}

.devminds-nw-km-hero-card-photo {
    width: 55px;
    height: 55px;
    border-radius: 0;
    object-fit: cover;
    flex-shrink: 0;
}

/* h5 global style override — card */
.devminds-nw-km-hero-card .devminds-nw-km-hero-card-name {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.3;
    color: var(--devminds-nw-km-color-dark);
    font-family: var(--devminds-nw-km-font);
}

.devminds-nw-km-hero-card-role {
    font-size: 20px !important;
    color: var(--devminds-nw-km-color-dark);
    margin: 0 0 7px 0;
    white-space: nowrap;
}

.devminds-nw-km-hero-card-badges {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.devminds-nw-km-hero-badge {
    font-size: 13px;
    font-weight: 400;
    padding: 5px 8px;
    border-radius: 3px;
    white-space: nowrap;
    font-family: var(--devminds-nw-km-font);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.devminds-nw-km-hero-badge-icon {
    flex-shrink: 0;
    display: block;
}

.devminds-nw-km-hero-badge-exp {
    background-color: #0B9D3B33;
    color: #0B9D3B;
}

.devminds-nw-km-hero-badge-type {
    background-color: #e8ecfb;
    color: var(--devminds-nw-km-color-blue);
}

.devminds-nw-km-hero-card-top {
    display: flex;
    gap: 10px;
    align-items: center;
    width: 100%;
}

.devminds-nw-km-hero-card-badges {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}

.devminds-nw-km-globe-card .devminds-nw-km-hero-card-badges {
    gap: 8px;
}

.devminds-nw-km-hero-card-badge-col {
    display: flex;
    align-items: center;
}

.devminds-nw-km-hero-card-badge-col .devminds-nw-km-hero-badge {
    width: 100%;
}

.devminds-nw-km-globe-card .devminds-nw-km-hero-badge {
    font-size: 14px;
    padding: 5px 8px;
    gap: 8px;
}

/* ---------- 3D ROTATING GLOBE ---------- */
.devminds-nw-km-hero-globe-viz {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 190%;
    height: 190%;
    transform: translate(-42%, -48%);
}

.devminds-nw-km-hero-globe-viz canvas {
    touch-action: none;
    background: transparent !important;
    pointer-events: none !important;
}

/* ---------- STATIC CARDS OVERLAY (fixed positions, never move) ---------- */
.devminds-nw-km-hero-cards-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
}

.devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card {
    position: absolute;
    pointer-events: auto;
}

.devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(1) { top: 5%; left: 22%; }
.devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(2) { top: 40%; left: 55%; }
.devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(3) { top: 72%; left: 6%; }

.devminds-nw-km-globe-card.devminds-nw-km-hero-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 322px;
    background-color: var(--devminds-nw-km-color-white);
    border-radius: 5px;
    padding: 8px 16px;
    cursor: default;
}

/* ---------- BOTTOM LOGO SLIDER ---------- */
.devminds-nw-km-hero-logos-wrapper {
    position: relative;
    z-index: 2;
    width: 100%;
    overflow: hidden;
    padding: 0 0 45px 0;
    margin-top: 40px;
}

.devminds-nw-km-hero-logos-track {
    display: flex;
    align-items: center;
    gap: 60px;
    width: max-content;
    animation: devminds-nw-km-scroll-logos 35s linear infinite;
}

@keyframes devminds-nw-km-scroll-logos {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-16.666%);
    }
}

.devminds-nw-km-hero-logo-item {
    height: 28px;
    width: auto;
    flex-shrink: 0;
    opacity: 0.85;
    filter: brightness(0) invert(1); /* white logos, remove if logos already white */
}

@keyframes devminds-nw-km-scroll-logos {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

/* ---------- SAFETY OVERRIDE: force the globe + cards visible, guard against any theme conflict ---------- */
.devminds-nw-km-hero-globe-viz,
.devminds-nw-km-hero-cards-overlay {
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
    clip: auto !important;
    clip-path: none !important;
    overflow: visible !important;
}

.devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card {
    visibility: visible !important;
    display: flex !important;
    clip: auto !important;
    clip-path: none !important;
    opacity: 1;
    transition: opacity 0.5s ease;
}

.devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card.devminds-nw-km-card-fade-out {
    opacity: 0;
}

/* ============ IMPACT SECTION ============ */

.devminds-nw-km-impact {
    background-color: #F4F6FC;
    padding: 50px 24px;
    position: relative;
    overflow: hidden;
}

.devminds-nw-km-impact-inner {
    max-width: 1280px;
    margin: 0 auto;
    position: relative;
}

.devminds-nw-km-impact-label {
    font-size: 16px;
    font-weight: 500;
    color: var(--devminds-nw-km-color-dark);
    text-align: center;
    margin-bottom: 40px;
}

.devminds-nw-km-impact-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.devminds-nw-km-impact-item {
    padding: 24px 24px;
    border-left: 1px solid #D8DCE8;
}

.devminds-nw-km-impact-item:first-child {
    border-left: none;
    padding-left: 0;
}

.devminds-nw-km-impact-item:first-child p {
    width: 100%;
    max-width: 260px;
}

.devminds-nw-km-impact-number {
    color: var(--devminds-nw-km-color-blue);
    font-weight: 500 !important;
    margin-bottom: 24px;
}

.devminds-nw-km-impact-title {
    color: var(--devminds-nw-km-color-dark);
    margin-bottom: 12px;
}

.devminds-nw-km-impact-desc {
    font-size: 14px;
    font-weight: 400;
    color: var(--devminds-nw-km-color-gray);
    line-height: 1.5;
    margin: 0;
}

.devminds-nw-km-impact-decor {
    position: absolute;
    right: -50px;
    bottom: -10px;
    width: 40px;
    height: auto;
    pointer-events: none;
}

/* ============ WHY CHOOSE US SECTION ============ */

.devminds-nw-km-why {
    background-color: var(--devminds-nw-km-color-white);
    padding: 80px 24px;
}

.devminds-nw-km-why-inner {
    max-width: 1280px;
    margin: 0 auto;
}

.devminds-nw-km-why-heading {
    color: var(--devminds-nw-km-color-dark);
    text-align: center;
    margin: 0 auto 20px;
    max-width: 800px;
}

.devminds-nw-km-why-subtext {
    font-size: 18px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-gray);
    text-align: center;
    max-width: 620px;
    margin: 0 auto 60px;
}

.devminds-nw-km-why-content {
    display: flex;
    align-items: center;
    gap: 60px;
}

/* ---------- LEFT LIST ---------- */
.devminds-nw-km-why-list {
    flex: 0 0 45%;
    max-width: 45%;
}

.devminds-nw-km-why-item {
    padding: 16px 24px 32px 24px;
    border-bottom: 1px solid var(--devminds-nw-km-color-border);
    transition: background-color 0.3s ease;
    cursor: default;
    position: relative;
}

.devminds-nw-km-why-item.devminds-nw-km-active {
    background-color: var(--devminds-nw-km-color-light-bg);
    border-radius: 12px 12px 0 0;
    border-bottom: none;
}

.devminds-nw-km-why-item-title {
    color: var(--devminds-nw-km-color-dark);
    margin-bottom: 10px;
}

.devminds-nw-km-why-item-desc {
    font-size: 18px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-gray);
    margin: 0;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: all 0.3s ease;
}

.devminds-nw-km-why-item.devminds-nw-km-active .devminds-nw-km-why-item-desc {
    max-height: 100px;
    opacity: 1;
    margin-top: 8px;
}

/* Progress bar — only active item visible */
.devminds-nw-km-why-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    width: 100%;
    background-color: var(--devminds-nw-km-color-border);
    display: none;
    overflow: hidden;
}

.devminds-nw-km-why-item.devminds-nw-km-active .devminds-nw-km-why-progress {
    display: block;
}

.devminds-nw-km-why-progress-bar {
    display: block;
    height: 100%;
    width: 0%;
    background-color: var(--devminds-nw-km-color-blue);
}

.devminds-nw-km-why-progress-bar.devminds-nw-km-animate {
    animation: devminds-nw-km-progress-fill linear forwards;
    animation-duration: var(--devminds-nw-km-why-duration, 4000ms);
}

@keyframes devminds-nw-km-progress-fill {
    from { width: 0%; }
    to { width: 100%; }
}

/* ---------- RIGHT IMAGE ---------- */
.devminds-nw-km-why-image-wrap {
    flex: 0 0 50%;
    max-width: 50%;
    position: relative;
    min-height: 460px;
}

.devminds-nw-km-why-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 8px;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.devminds-nw-km-why-image.devminds-nw-km-active {
    opacity: 1;
}

/* ========================================= SERVICES SECTION =========================================== */

.devminds-nw-km-services {
    background-color: var(--devminds-nw-km-color-light-bg);
    padding: 80px 0;
    overflow: hidden;=
}

.devminds-nw-km-services-heading-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}

.devminds-nw-km-services-heading {
    color: var(--devminds-nw-km-color-dark);
    text-align: center;
    margin-bottom: 50px;
}

/* Full-width slider — koi container padding nahi */
.devminds-nw-km-services-slider-wrap {
    width: 100%;
    overflow: hidden;
}

.devminds-nw-km-services-track {
    display: flex;
    align-items: stretch;
    gap: 20px;
    width: max-content;
    animation: devminds-nw-km-services-scroll 40s linear infinite;
}

.devminds-nw-km-services-slider-wrap:hover .devminds-nw-km-services-track {
    animation-play-state: paused;
}

@keyframes devminds-nw-km-services-scroll {
    from { transform: translateX(0); }
    to { transform: translateX(-33.333%); }
}

.devminds-nw-km-services-card {
    flex: 0 0 auto;
    width: 280px;
    background-color: var(--devminds-nw-km-color-white);
    border: 1px solid var(--devminds-nw-km-color-border);
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.devminds-nw-km-services-card-title-wrap {
    padding: 24px 24px 20px;
    margin-top: auto;
}

.devminds-nw-km-services-card-title {
    color: var(--devminds-nw-km-color-dark);
    font-weight: 400 !important;
    margin: 0;
}

.devminds-nw-km-services-card-img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
}

/* ==================================== HOW WE WORK SECTION ======================================== */

.devminds-nw-km-how {
    background-color: var(--devminds-nw-km-color-white);
    padding: 80px 24px;
}

.devminds-nw-km-how-inner {
    max-width: 1280px;
    margin: 0 auto;
}

.devminds-nw-km-how-heading {
    color: var(--devminds-nw-km-color-dark);
    text-align: center;
    margin: 0 auto 20px;
    max-width: 900px;
}

.devminds-nw-km-how-subtext {
    font-size: 18px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-gray);
    text-align: center;
    max-width: 620px;
    margin: 0 auto 50px;
}

.devminds-nw-km-how-content {
    display: flex;
    align-items: stretch;
    gap: 24px;
}

/* ---------- LEFT: TABS ---------- */
.devminds-nw-km-how-tabs {
    flex: 0 0 32%;
    max-width: 32%;
    background-color: var(--devminds-nw-km-color-light-bg);
    box-shadow: 2px 2px 12px 0 rgba(0, 0, 0, 0.08);
    border-radius: 12px;
    padding: 24px;
}

.devminds-nw-km-how-tabs-label {
    font-size: 18px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-dark);
    margin: 0 0 16px 0;
}

.devminds-nw-km-how-tab-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    background: none;
    border: none;
    padding: 12px 16px;
    border-radius: 30px;
    text-align: left;
    cursor: pointer;
    margin-bottom: 6px;
    transition: all 0.25s ease;
}

.devminds-nw-km-how-tab-btn span {
    font-size: 16px;
    font-weight: 500;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-muted);
    transition: color 0.25s ease;
}

.devminds-nw-km-how-tab-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    opacity: 0.5;
    transition: opacity 0.25s ease;
}

.devminds-nw-km-how-tab-btn.devminds-nw-km-active {
    background-color: var(--devminds-nw-km-color-blue);
}

.devminds-nw-km-how-tab-btn.devminds-nw-km-active span {
    color: var(--devminds-nw-km-color-white);
}

.devminds-nw-km-how-tab-btn.devminds-nw-km-active .devminds-nw-km-how-tab-icon {
    opacity: 1;
    filter: brightness(0) invert(1);
}

/* ---------- RIGHT: PANELS ---------- */
.devminds-nw-km-how-panels {
    flex: 0 0 66%;
    max-width: 68%;
    position: relative;
}

.devminds-nw-km-how-panel {
    display: none;
    background-color: var(--devminds-nw-km-color-light-bg);
    border-radius: 12px;
    padding: 40px;
    height: 100%;
}

.devminds-nw-km-how-panel.devminds-nw-km-active {
    display: block;
}

.devminds-nw-km-how-panel-icon {
    width: 56px;
    height: 56px;
    background-color: var(--devminds-nw-km-color-blue);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
}

.devminds-nw-km-how-panel-icon img {
    width: 26px;
    height: 26px;
    filter: brightness(0) invert(1);
}

.devminds-nw-km-how-panel-heading {
    color: var(--devminds-nw-km-color-dark);
    margin-bottom: 16px;
}

.devminds-nw-km-how-panel-desc {
    font-size: 18px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-gray);
    margin-bottom: 28px;
    max-width: 600px;
}

.devminds-nw-km-how-panel-btn {
    display: inline-block;
    background-color: var(--devminds-nw-km-color-blue);
    color: var(--devminds-nw-km-color-white);
    text-decoration: none;
    padding: 16px 28px;
    border-radius: 30px;
    transition: background-color 0.2s ease;
}

.devminds-nw-km-how-panel-btn:hover {
    background-color: #1d3a94;
    color: var(--devminds-nw-km-color-white);
}

/* ============ HOW WE WORK — MOBILE ACCORDION ============ */

.devminds-nw-km-how-mobile-slot {
    display: none;
}

.devminds-nw-km-how-tab-btn {
    position: relative;
}

.devminds-nw-km-how-tab-chevron {
    display: none;
}

/* =========================== PROJECTS SECTION ============================ */

.devminds-nw-km-projects {
    background-color: var(--devminds-nw-km-color-light-bg);
    padding: 80px 24px;
}

.devminds-nw-km-projects-inner {
    max-width: 1280px;
    margin: 0 auto;
}

.devminds-nw-km-projects-heading {
    color: var(--devminds-nw-km-color-dark);
    text-align: center;
    margin-bottom: 16px;
}

.devminds-nw-km-projects-subtext {
    font-size: 18px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-gray);
    text-align: center;
    max-width: 620px;
    margin: 0 auto 32px;
}

/* ---------- FILTER TABS ---------- */
.devminds-nw-km-projects-tabs {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
}

.devminds-nw-km-projects-tabs-toggle {
    display: none;
}

.devminds-nw-km-projects-tab {
    font-family: var(--devminds-nw-km-font);
    font-size: 14px;
    font-weight: 500;
    background: var(--devminds-nw-km-color-transparent);
    color: var(--devminds-nw-km-color-dark);
    border: 1px solid var(--devminds-nw-km-color-dark);
    padding: 8px 24px;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.devminds-nw-km-projects-tab.devminds-nw-km-active {
    background-color: var(--devminds-nw-km-color-blue);
    color: var(--devminds-nw-km-color-white);
    border-color: var(--devminds-nw-km-color-blue);
}

/* ---------- SUB-CATEGORY ROWS (two-level filter) ---------- */
.devminds-nw-km-projects-subcats-wrap {
    position: relative;
    margin: 0 auto 40px auto;
    padding: 10px 16px;
    background: #264CBE1A;
    border-radius: 100px;
    max-width: 490px;
}

.devminds-nw-km-projects-subcat-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 16px;
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-16px);
    overflow: hidden;
    pointer-events: none;
    transition: opacity 0.35s ease, transform 0.35s ease, max-height 0.35s ease, visibility 0.35s ease;
}

.devminds-nw-km-projects-subcat-row.devminds-nw-km-active {
    max-height: 200px;
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    pointer-events: auto;
}

.devminds-nw-km-projects-subcat-label {
    font-family: var(--devminds-nw-km-font);
    font-size: 14px;
    font-weight: 500;
    color: var(--devminds-nw-km-color-gray);
    margin-right: 4px;
}

.devminds-nw-km-projects-subcat {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: var(--devminds-nw-km-font)'Aeonik', sans-serif;
    font-size: 14px;
    font-weight: 500;
    background: var(--devminds-nw-km-color-transparent);
    color: var(--devminds-nw-km-color-dark);
    border: 1px solid var(--devminds-nw-km-color-dark);
    padding: 8px 12px;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.devminds-nw-km-projects-subcat.devminds-nw-km-active {
    background-color: var(--devminds-nw-km-color-blue);
    color: var(--devminds-nw-km-color-white);
    border-color: var(--devminds-nw-km-color-blue);
}

.devminds-nw-km-projects-subcat-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    border-radius: 50%;
    flex-shrink: 0;
}

/* ---------- SUB-CATEGORY SCROLLER ---------- */
.devminds-nw-km-projects-subcat-label {
    flex-shrink: 0;
}

.devminds-nw-km-projects-subcat-scroll-wrap {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
}

.devminds-nw-km-projects-subcat-scroller {
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
    cursor: grab;
    user-select: none;

    scrollbar-width: none;
    -ms-overflow-style: none;
}

.devminds-nw-km-projects-subcat-scroller::-webkit-scrollbar {
    display: none;
}

.devminds-nw-km-projects-subcat-scroller.devminds-nw-km-dragging {
    cursor: grabbing;
    scroll-behavior: auto;
}


.devminds-nw-km-projects-subcat-scroll-wrap.devminds-nw-km-can-scroll-prev .devminds-nw-km-projects-subcat-scroller,
.devminds-nw-km-projects-subcat-scroll-wrap.devminds-nw-km-can-scroll-next .devminds-nw-km-projects-subcat-scroller {
    -webkit-mask-image: linear-gradient(to right, transparent 0, black 24px, black calc(100% - 24px), transparent 100%);
    mask-image: linear-gradient(to right, transparent 0, black 24px, black calc(100% - 24px), transparent 100%);
}

.devminds-nw-km-projects-subcat-track {
    display: flex;
    align-items: center;
    gap: 16px;
    width: max-content;
    padding: 2px 6px;
}

/* Chhota floating circle arrow — koi background box/rectangle nahi, sirf shadow */
.devminds-nw-km-projects-subcat-arrow {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: var(--devminds-nw-km-color-white);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, background-color 0.2s ease;
    z-index: 5;
}

.devminds-nw-km-projects-subcat-scroll-wrap.devminds-nw-km-can-scroll-prev .devminds-nw-km-projects-subcat-arrow[data-devminds-nw-km-dir="prev"],
.devminds-nw-km-projects-subcat-scroll-wrap.devminds-nw-km-can-scroll-next .devminds-nw-km-projects-subcat-arrow[data-devminds-nw-km-dir="next"] {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.devminds-nw-km-projects-subcat-arrow:hover {
    background-color: var(--devminds-nw-km-color-blue);
}

.devminds-nw-km-projects-subcat-arrow:hover::before {
    border-color: var(--devminds-nw-km-color-white);
}

.devminds-nw-km-projects-subcat-arrow::before {
    content: '';
    width: 7px;
    height: 7px;
    border-right: 2px solid var(--devminds-nw-km-color-dark);
    border-bottom: 2px solid var(--devminds-nw-km-color-dark);
    transform: rotate(-45deg);
    transition: border-color 0.2s ease;
}

.devminds-nw-km-projects-subcat-arrow[data-devminds-nw-km-dir="prev"]::before {
    transform: rotate(135deg);
}

/* ---------- STATIC MODE ---------- */
@media (min-width: 601px) {
    .devminds-nw-km-projects-subcat-scroll-wrap.devminds-nw-km-subcat-static .devminds-nw-km-projects-subcat-scroller {
        overflow: visible;
        cursor: default;
        mask-image: none;
        -webkit-mask-image: none;
    }

    .devminds-nw-km-projects-subcat-scroll-wrap.devminds-nw-km-subcat-static .devminds-nw-km-projects-subcat-track {
        width: auto;
        flex-wrap: wrap;
        justify-content: center;
    }

    .devminds-nw-km-projects-subcat-scroll-wrap.devminds-nw-km-subcat-static .devminds-nw-km-projects-subcat-arrow {
        display: none;
    }
}

/* ---------- SLIDER ---------- */
.devminds-nw-km-projects-slider-wrap {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    max-width: 1280px;
    margin: auto;
}

.devminds-nw-km-projects-slide {
    display: none;
    background-color: var(--devminds-nw-km-color-navy);
    background-image: url('https://devmindsstudio.com/wp-content/uploads/2026/08/Rectangle-34647524.avif');
    background-size: cover;
    background-position: center;
    padding: 40px;
}

.devminds-nw-km-projects-slide.devminds-nw-km-active {
    display: block;
}

.devminds-nw-km-projects-slide-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
}

/* Exception: H3 tag but using h5-style typography (24px/600 — note: 600 is heavier
   than the global h5 weight of 500, this is an intentional design exception for this section) */
.devminds-nw-km-projects-slide-title {
    font-size: 24px !important;
    line-height: 1.3 !important;
    color: var(--devminds-nw-km-color-white);
    max-width: 400px;
    margin: 0;
}

.devminds-nw-km-projects-meta {
    display: flex;
    align-items: center;
    gap: 30px;
}

.devminds-nw-km-projects-meta-item {
    padding-left: 30px;
    border-left: 1px solid rgba(255, 255, 255, 0.25);
}

.devminds-nw-km-projects-meta-item:first-child {
    padding-left: 0;
    border-left: none;
}

.devminds-nw-km-projects-meta-value {
    font-size: 18px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-white);
    margin: 0 0 4px 0;
}

.devminds-nw-km-projects-meta-label {
    color: #FFFFFF80;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    text-align: center;
    margin: 0;
}

/* ---------- IMAGE (before/after) ---------- */
.devminds-nw-km-projects-image-wrap {
    position: relative;
    width: 100%;
    border-radius: 14px;
    overflow: hidden;
    min-height: 556px;
    max-width: 1120px;
    margin: 0 auto;
}

.devminds-nw-km-projects-image {
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    object-fit: cover;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.devminds-nw-km-projects-image.devminds-nw-km-active {
    opacity: 1;
}

/* ---------- BOTTOM (toggle + arrow) ---------- */
.devminds-nw-km-projects-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 24px;
}

.devminds-nw-km-projects-toggle {
    display: inline-flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 30px;
    padding: 0;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.4);
}

.devminds-nw-km-projects-toggle-btn {
    font-family: var(--devminds-nw-km-font);
    font-size: 18px;
    font-weight: 400;
    background: none;
    border: none;
    color: var(--devminds-nw-km-color-white);
    padding: 8px 33px;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.devminds-nw-km-projects-toggle-btn.devminds-nw-km-active {
    background-color: var(--devminds-nw-km-color-white);
    color: var(--devminds-nw-km-color-dark);
    padding: 8px 40px;
}

.devminds-nw-km-projects-arrow {
    width: 40px;
    height: 40px;
    background-color: var(--devminds-nw-km-color-white);
    color: var(--devminds-nw-km-color-blue);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 20px;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.devminds-nw-km-projects-arrow:hover {
    transform: scale(1.08);
}

/* ---------- PAGINATION DOTS ---------- */
.devminds-nw-km-projects-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 30px;
}

.devminds-nw-km-projects-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--devminds-nw-km-color-dot-inactive);
    cursor: pointer;
    transition: all 0.25s ease;
}

.devminds-nw-km-projects-dot.devminds-nw-km-active {
    width: 77px;
    border-radius: 4px;
    background-color: var(--devminds-nw-km-color-blue);
}

/* ==================================== TALENT SECTION ==================================== */

.devminds-nw-km-talent {
    background-color: var(--devminds-nw-km-color-blue);
    padding: 64px 0;
    overflow: hidden;
}

.devminds-nw-km-talent__inner {
    max-width: 600px;
    margin: 0 auto;
    padding: 0 24px;
    text-align: center;
}

.devminds-nw-km-talent__heading {
    color: var(--devminds-nw-km-color-white);
    margin-bottom: 24px;
}

.devminds-nw-km-talent__subtext {
    font-size: 18px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-white);
    margin: 0 0 48px;
}

/* ---------- Marquee viewport ---------- */
.devminds-nw-km-talent__marquee-wrap {
    width: 100%;
    overflow: hidden;
    /* Fade effect on the left/right edges, same feel as the Figma design */
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
}

.devminds-nw-km-talent__track {
    display: flex;
    align-items: stretch;
    gap: 24px;
    width: max-content;
    animation: devminds-nw-km-talent-scroll var(--devminds-nw-km-talent-duration, 120s) linear infinite;
}

.devminds-nw-km-talent__marquee-wrap:hover .devminds-nw-km-talent__track {
    animation-play-state: paused;
}

/* Track scrolls exactly by 50% — works because JS duplicates the card set once,
   so the first half and second half are identical and the loop looks seamless. */
@keyframes devminds-nw-km-talent-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* Respect users who prefer reduced motion — no forced continuous animation */
@media (prefers-reduced-motion: reduce) {
    .devminds-nw-km-talent__track {
        animation: none;
    }
}

/* ---------- Card (base) ---------- */
.devminds-nw-km-talent__card {
    position: relative;
    flex: 0 0 auto;
    width: 325px;
    height: 372px; /* fixed height so the hover reveal doesn't shift card size / marquee alignment */
    background-color: var(--devminds-nw-km-color-white);
    border-radius: 12px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    overflow: hidden; /* keeps the button clipped/hidden until hover */
}

.devminds-nw-km-talent__card .devminds-nw-km-talent__skills-wrap {
    transition: opacity 0.3s;
}

.devminds-nw-km-talent__card:hover .devminds-nw-km-talent__skills-wrap {
    opacity: 0;
}

.devminds-nw-km-talent__card-top {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 34px;
}

.devminds-nw-km-talent__photo {
    width: 53px;
    height: 53px;
    object-fit: cover;
    flex-shrink: 0;
    display: block;
}

.devminds-nw-km-talent__identity {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.devminds-nw-km-talent__name {
    font-size: 16px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-gray);
    margin: 0;
}

.devminds-nw-km-talent__card .devminds-nw-km-talent__designation {
    font-size: 24px;
    font-weight: 500;
    color: var(--devminds-nw-km-color-dark);
    margin: 0;
    line-height: 1.25;
}

.devminds-nw-km-talent__badges {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 34px;
}

.devminds-nw-km-talent__badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    padding: 8px 12px;
    border-radius: 4px;
    white-space: nowrap;
}

.devminds-nw-km-talent__badge-icon {
    flex-shrink: 0;
    display: block;
}

.devminds-nw-km-talent__badge--exp {
    background-color: #0B9D3B33;
    color: #0B9D3B;
}

.devminds-nw-km-talent__badge--type {
    background-color: #D4DBF2;
    color: var(--devminds-nw-km-color-gray);
}

.devminds-nw-km-talent__desc {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-gray);
    margin: 0 0 20px;
    /* Clamp to 3 lines so description length doesn't affect card height */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ---------- Skills wrap — this is the part that slides UP on hover ---------- */
.devminds-nw-km-talent__skills-wrap {
    transition: transform 0.35s ease;
}


.devminds-nw-km-talent__skills-heading {
    font-size: 18px !important;
    font-weight: 500;
    color: var(--devminds-nw-km-color-dark);
    margin: 0 0 12px;
}

.devminds-nw-km-talent__skills {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.devminds-nw-km-talent__skill {
    font-size: 12px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-dark);
    background-color: transparent;
    border: 1px solid #C3C6D4;
    padding: 5px 8px;
    border-radius: 4px;
    white-space: nowrap;
}

.devminds-nw-km-talent__skill--more {
    color: var(--devminds-nw-km-color-gray);
}

/* ---------- Button — hidden by default, revealed smoothly on card hover ---------- */
.devminds-nw-km-talent__btn {
    position: absolute;
    bottom: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background-color: var(--devminds-nw-km-color-dark);
    color: var(--devminds-nw-km-color-white);
    text-decoration: none;
    padding: 10px 12px;
    border-radius: 100px;
    opacity: 0;
    transform: translateY(0px);
    pointer-events: none;
    transition: opacity 0.3s ease, transform 0.35s ease, background-color 0.2s ease;
}

.devminds-nw-km-talent__card:hover .devminds-nw-km-talent__btn {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.devminds-nw-km-talent__btn:hover {
    background-color: rgba(0, 0, 0, 0.9);
    color: var(--devminds-nw-km-color-white);
}

.devminds-nw-km-talent__plus-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: var(--devminds-nw-km-color-blue);
    flex-shrink: 0;
}

/* ---------- Custom Talent CTA card ---------- */
.devminds-nw-km-talent__card--cta {
    position: relative;
    padding: 0;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border: 2px dashed rgba(0, 0, 0, 0.75); /* dashed border as per Figma design */
}

.devminds-nw-km-talent__cta-img {
    width: 100%;
    height: 100%;
    min-height: 320px;
    object-fit: cover;
    filter: blur(6px);
    transform: scale(1.05);
    display: block;
}

.devminds-nw-km-talent__cta-btn {
position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background-color: var(--devminds-nw-km-color-dark);
    color: var(--devminds-nw-km-color-white);
    text-decoration: none;
    padding: 10px 12px;
    border-radius: 100px;
    white-space: nowrap;
    transition: background-color 0.2s ease;
}

.devminds-nw-km-talent__cta-btn:hover {
    background-color: rgba(0, 0, 0, 0.9);
    color: var(--devminds-nw-km-color-white);
}


/* ============ TESTIMONIALS SECTION ============ */

.devminds-nw-km-testi {
    background-color: var(--devminds-nw-km-color-light-bg);
    padding: 80px 0;
    overflow: hidden;
}

.devminds-nw-km-testi-heading-wrap {
    max-width: 700px;
    margin: 0 auto;
    padding: 0 24px;
    text-align: center;
}

.devminds-nw-km-testi-heading {
    color: var(--devminds-nw-km-color-dark);
    margin-bottom: 16px;
}

.devminds-nw-km-testi-subtext {
    font-size: 18px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-gray);
    margin: 0 0 50px;
}

/* ---------- SLIDER (coverflow effect) ---------- */
.devminds-nw-km-testi-slider-wrap {
    position: relative;
    width: 100%;
}

.devminds-nw-km-testi-track {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 500px;
}

.devminds-nw-km-testi-slide {
    position: absolute;
    width: 300px;
    background-color: var(--devminds-nw-km-color-testi-inactive);
    border-radius: 16px;
    padding: 30px;
    text-align: center;
    transition: transform 0.5s ease, opacity 0.5s ease, background-color 0.5s ease;
    opacity: 0;
    pointer-events: none;
}

/* Center (active) slide */
.devminds-nw-km-testi-slide[data-devminds-nw-km-offset="0"] {
    background-color: var(--devminds-nw-km-color-blue);
    transform: translateX(0) translateY(0) rotate(0deg) scale(1);
    opacity: 1;
    z-index: 5;
    pointer-events: auto;
    box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.15);
}

.devminds-nw-km-testi-slide[data-devminds-nw-km-offset="0"] .devminds-nw-km-testi-content,
.devminds-nw-km-testi-slide[data-devminds-nw-km-offset="0"] .devminds-nw-km-testi-name,
.devminds-nw-km-testi-slide[data-devminds-nw-km-offset="0"] .devminds-nw-km-testi-designation {
    color: var(--devminds-nw-km-color-white);
    opacity: 1;
}

/* Neighboring slides — 1 step away */
.devminds-nw-km-testi-slide[data-devminds-nw-km-offset="-1"] {
    transform: translateX(-330px) translateY(20px) rotate(-6deg) scale(0.99);
    opacity: 0.45;
    z-index: 4;
}

.devminds-nw-km-testi-slide[data-devminds-nw-km-offset="1"] {
    transform: translateX(330px) translateY(20px) rotate(6deg) scale(0.99);
    opacity: 0.45;
    z-index: 4;
}

.devminds-nw-km-testi-slide[data-devminds-nw-km-offset="-2"] {
    transform: translateX(-650px) translateY(70px) rotate(-11deg) scale(0.99);
    opacity: 0.45;
    z-index: 3;
}

.devminds-nw-km-testi-slide[data-devminds-nw-km-offset="2"] {
    transform: translateX(650px) translateY(70px) rotate(11deg) scale(0.99);
    opacity: 0.45;
    z-index: 3;
}

.devminds-nw-km-testi-content {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-dark);
    margin-bottom: 24px;
}

.devminds-nw-km-testi-content p {
    margin: 0;
}

.devminds-nw-km-testi-content p br {
    display: none;
}

.devminds-nw-km-testi-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto 14px;
    border: 1px solid var(--devminds-nw-km-color-white);
}

.devminds-nw-km-testi-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.devminds-nw-km-testi-name {
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 24px !important;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-dark);
    margin: 0 0 4px 0;
}

.devminds-nw-km-testi-designation {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-dark);
    margin: 0;
    opacity: 0.7;
}

/* ---------- NAV ARROWS ---------- */
.devminds-nw-km-testi-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 30px;
}

.devminds-nw-km-testi-prev svg {
    transform: rotate(225deg);
}

.devminds-nw-km-testi-next svg {
    transform: rotate(45deg);
}

.devminds-nw-km-testi-arrow {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-color: var(--devminds-nw-km-color-white);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s ease;
}

.devminds-nw-km-testi-arrow:hover {
    transform: scale(1.05);
}

/* =============================== CTA SECTION ============================== */

.devminds-nw-km-cta {
    background-color: var(--devminds-nw-km-color-blue);
    background-image: url('https://devmindsstudio.com/wp-content/uploads/2026/08/Rectangle-34647529.avif');
    background-size: cover;
    background-position: center;
    padding: 70px 24px;
    overflow: hidden;
}

.devminds-nw-km-cta-inner {
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.devminds-nw-km-cta-left {
    flex: 0 0 45%;
    max-width: 48%;
}

.devminds-nw-km-cta-heading {
    color: var(--devminds-nw-km-color-white);
    margin-bottom: 24px;
}

.devminds-nw-km-cta-subtext {
    font-size: 18px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: rgba(255, 255, 255, 0.85);
    margin: 0 0 60px;
    max-width: 530px;
}

.devminds-nw-km-cta-btn {
    display: inline-block;
    background-color: var(--devminds-nw-km-color-white);
    color: var(--devminds-nw-km-color-blue);
    text-decoration: none;
    padding: 16px 32px;
    border-radius: 30px;
    transition: background-color 0.2s ease;
}

.devminds-nw-km-cta-btn:hover {
    background-color: #eef1fb;
    color: var(--devminds-nw-km-color-blue);
}

.devminds-nw-km-cta-right {
    flex: 0 0 48%;
    max-width: 48%;
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 0;
}

/* CTA Image Animation Container */
.devminds-nw-km-cta-image-stack {
    position: relative;
    width: 100%;
    max-width: 528px;
    margin: 0 auto;

    /* Important: gives the container height */
    aspect-ratio: 1 / 1;

    overflow: visible;
}

/* CTA Images */
.devminds-nw-km-cta-image {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    /*
     * contain prevents image cropping
     * Entire image will remain visible
     */
    object-fit: contain;

    object-position: center;

    display: block;

    opacity: 0;
    visibility: hidden;

    transition:
        opacity 0.6s ease,
        visibility 0.6s ease;

    pointer-events: none;
}

/* Active Image */
.devminds-nw-km-cta-image.devminds-nw-km-active {
    opacity: 1;
    visibility: visible;
}

/* ============ FOOTER ============ */

.devminds-nw-km-footer {
    background-color: var(--devminds-nw-km-color-white);
    padding: 70px 24px 0;
}
.devminds-nw-km-footer-col.devminds-nw-km-footer-industries {
    display: none;
}
.devminds-nw-km-footer-col.devminds-nw-km-footer-quick-links {
    display: none;
}
.devminds-nw-km-footer-inner {
    max-width: 1280px;
    margin: 0 auto;
}

.devminds-nw-km-footer-top {
    display: flex;
    gap: 40px;
    padding-bottom: 32px;
    justify-content: space-between;
}

.devminds-nw-km-footer-brand {
    max-width: 302px !important;
    width: 100% !important;
}

.devminds-nw-km-footer-col {
    max-width: 200px;
    width: 100%;
}



/* Column 1: Brand */
.devminds-nw-km-footer-logo {
    max-height: 48px;
    width: auto;
    margin-bottom: 16px;
}

.devminds-nw-km-footer-desc {
    font-size: 16px;
    font-weight: 400;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-gray);
    line-height: 1.6;
    margin: 0 0 24px;
}

.devminds-nw-km-footer-social {
    display: flex;
    align-items: center;
    gap: 14px;
}

.devminds-nw-km-footer-social-icon {
    display: flex;
    align-items: center;
    justify-content: start;
    width: 32px;
    height: 32px;
}

/* Column titles */
.devminds-nw-km-footer-col-title {
    color: var(--devminds-nw-km-color-dark);
    margin-bottom: 16px;
}

/* Column menu lists */
.devminds-nw-km-footer-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.devminds-nw-km-footer-menu li {
    margin-bottom: 6px;
}

.devminds-nw-km-footer-menu li a,
.devminds-nw-km-footer-menu li.devminds-nw-km-footer-address {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-footer-link);
    text-decoration: none;
}

.devminds-nw-km-footer-menu li a:hover {
    color: var(--devminds-nw-km-color-blue);
}

.devminds-nw-km-footer-address {
    display: block;
    font-size: 16px;
    line-height: 24px;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-footer-link);
}

/* Divider */
.devminds-nw-km-footer-divider {
    height: 1px;
    background-color: var(--devminds-nw-km-color-border);
}

/* Bottom bar */
.devminds-nw-km-footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 24px 0;
}

.devminds-nw-km-footer-copyright {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-gray);
    margin: 0;
}

.devminds-nw-km-footer-legal {
    display: flex;
    align-items: center;
    gap: 24px;
}

.devminds-nw-km-footer-legal-link {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    font-family: var(--devminds-nw-km-font);
    color: var(--devminds-nw-km-color-gray);
    text-decoration: none;
}

.devminds-nw-km-footer-legal-link:hover {
    color: var(--devminds-nw-km-color-blue);
}

/* ===================== STICKY HEADER ON SCROLL ===================== */

.devminds-nw-km-header {
    position: fixed;
    top: 32px;
    left: 50%;
    transform: translateX(-50%);
    max-width: 1280px;
    width: calc(100% - 48px);
    border-radius: 60px;
    transition:
        top 0.4s ease,
        width 0.4s ease,
        max-width 0.4s ease,
        border-radius 0.4s ease,
        background-color 0.4s ease,
        box-shadow 0.4s ease;
}
 

.devminds-nw-km-header.devminds-nw-km-scrolled {
    top: 0;
    width: 100%;
    max-width: 100%;
    border-radius: 0;
    background-color: var(--devminds-nw-km-color-white);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
}

/* ===================== HEADER FADE HIDE/SHOW ON SCROLL DIRECTION ===================== */

.devminds-nw-km-header {
    opacity: 1;
    visibility: visible;
    transition:
        top 0.4s ease,
        width 0.4s ease,
        max-width 0.4s ease,
        border-radius 0.4s ease,
        background-color 0.4s ease,
        box-shadow 0.4s ease,
        opacity 0.35s ease,
        visibility 0.35s ease;
}

.devminds-nw-km-header.devminds-nw-km-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

/* ========================================== RESPONSIVE TYPOGRAPHY ========================================= */
/* Laptop */
@media (max-width: 1280px) {
    .devminds-nw-km-footer-top {
        display: grid;
        grid-template-columns: 1.6fr 1fr 1fr 1fr 1.2fr;
        gap: 30px;
        padding-bottom: 32px;
    }
    
    .devminds-nw-km-page h1 {
        font-weight: 500;
        font-size: 60px;
        line-height: 1.1;
    }
    
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(2) {
        top: 40%;
        left: 40%;
    }
}

/* Tablet */
@media (max-width: 1024px) {
    .devminds-nw-km-page h1 { font-size: 56px; line-height: 1.15; }
    .devminds-nw-km-page h2 { font-size: 38px; line-height: 46px; }
    .devminds-nw-km-page h3 { font-size: 32px; line-height: 40px; }
    .devminds-nw-km-page h4 { font-size: 26px; line-height: 34px; }
    .devminds-nw-km-page h5 { font-size: 22px; }
    .devminds-nw-km-page h6 { font-size: 19px; line-height: 23px; }

    .devminds-nw-km-desktop-only {
        display: none !important;
    }
    .devminds-nw-km-hamburger {
        display: flex;
    }
    .devminds-nw-km-header-inner {
        padding: 12px 20px;
    }

    .devminds-nw-km-header {
        width: calc(100% - 32px);
        top: 16px;
        border-radius: 40px;
    }

    .devminds-nw-km-hero {
        padding: 130px 20px 0;
    }
    .devminds-nw-km-hero-inner {
        flex-direction: column;
        gap: 50px;
    }
    .devminds-nw-km-hero-left,
    .devminds-nw-km-hero-right {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .devminds-nw-km-hero-right {
        position: relative;
        height: 480px;
        min-height: 0;
        overflow: visible;
    }
    
    .devminds-nw-km-hero-globe-viz {
        position: relative !important;
        top: 50%;
        left: 50%;
        width: 120%;
        height: 150%;
        transform: translate(-50%, -15%) !important;
    }
    
    .scene-container {
        width: 1201px !important;
        height: 900px !important;
    }
    
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(1) { top: 5%; left: 15%; }
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(2) { top: 25%; left: 45%; }
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(3) { top: 45%; left: 7%; }
    
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card {
        transform: scale(0.85) !important;
    }
    
    .devminds-nw-km-hero-logos-wrapper {
        margin-top: -270px;
    }
    
    .devminds-nw-km-impact-grid {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 40px;
    }

    .devminds-nw-km-impact-item:nth-child(3) {
        border-left: none;
        padding-left: 0;
    }
    
    .devminds-nw-km-impact-item:first-child p {
        width: 100%;
        max-width: 100%;
    }
    
    .devminds-nw-km-impact-decor {
        right: -10px;
        bottom: -30px;
    }
    
    .devminds-nw-km-why {
        padding: 60px 20px;
    }

    .devminds-nw-km-why-content {
        flex-direction: column;
        gap: 40px;
    }

    .devminds-nw-km-why-list,
    .devminds-nw-km-why-image-wrap {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .devminds-nw-km-why-image-wrap {
        min-height: 520px;
        width: 100%;
    }
    
    .devminds-nw-km-services {
        padding: 50px 0;
    }

    .devminds-nw-km-services-heading {
        margin-bottom: 36px;
    }

    .devminds-nw-km-services-card {
        width: 240px;
    }

    .devminds-nw-km-services-card-img {
        height: 180px;
    }
    
    .devminds-nw-km-how {
        padding: 60px 20px;
    }

    .devminds-nw-km-how-content {
        flex-direction: column;
    }

    .devminds-nw-km-how-tabs,
    .devminds-nw-km-how-panels {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .devminds-nw-km-how-panel {
        padding: 30px;
    }
    
    .devminds-nw-km-how-tabs {
        padding: 8px 16px;
    }

    .devminds-nw-km-how-tab-item {
        border-bottom: 1px solid var(--devminds-nw-km-color-border);
    }

    .devminds-nw-km-how-tab-item:last-child {
        border-bottom: none;
    }

    .devminds-nw-km-how-tab-btn {
        background: none;
        border-radius: 30px;
        justify-content: space-between;
        padding: 14px 16px;
    }

    /* Active tab in accordion — same style as desktop active tab */
    .devminds-nw-km-how-tab-btn.devminds-nw-km-active {
        background-color: var(--devminds-nw-km-color-blue);
    }

    .devminds-nw-km-how-tab-btn.devminds-nw-km-active span:not(.devminds-nw-km-how-tab-chevron) {
        color: var(--devminds-nw-km-color-white);
    }

    .devminds-nw-km-how-tab-btn.devminds-nw-km-active .devminds-nw-km-how-tab-icon {
        opacity: 1;
        filter: brightness(0) invert(1);
    }

    .devminds-nw-km-how-tab-btn.devminds-nw-km-active .devminds-nw-km-how-tab-chevron {
        border-color: var(--devminds-nw-km-color-white);
    }

    .devminds-nw-km-how-tab-chevron {
        display: block;
        width: 9px;
        height: 9px;
        border-right: 2px solid var(--devminds-nw-km-color-muted);
        border-bottom: 2px solid var(--devminds-nw-km-color-muted);
        transform: rotate(45deg);
        transition: transform 0.3s ease;
        margin-left: auto;
        flex-shrink: 0;
    }

    .devminds-nw-km-how-tab-btn.devminds-nw-km-active .devminds-nw-km-how-tab-chevron {
        transform: rotate(-135deg);
        border-color: var(--devminds-nw-km-color-white);
    }

    /* Accordion slot animation */
    .devminds-nw-km-how-mobile-slot {
        display: block;
        overflow: hidden;
        max-height: 0;
        transition: max-height 0.35s ease;
    }

    .devminds-nw-km-how-mobile-slot.devminds-nw-km-slot-open {
        max-height: 700px;
    }

   
    .devminds-nw-km-how-panels {
        display: none;
    }
    
    .devminds-nw-km-how-panel {
        display: block !important;
        border-radius: 8px;
        padding: 20px;
        margin: 8px 0 16px;
    }
    
    .devminds-nw-km-projects {
        padding: 60px 20px;
    }

    .devminds-nw-km-projects-slide {
        padding: 30px;
    }

    .devminds-nw-km-projects-slide-top {
        flex-direction: column;
    }

    .devminds-nw-km-projects-image-wrap {
        min-height: 460px;
    }
    
    .devminds-nw-km-testi {
        padding: 60px 0;
    }

    .devminds-nw-km-testi-slide {
        width: 300px;
        padding: 24px;
    }

    .devminds-nw-km-testi-track {
        height: 380px;
    }

    /* Only 3 cards visible on tablet — hide the outer pair */
    .devminds-nw-km-testi-slide[data-devminds-nw-km-offset="-2"],
    .devminds-nw-km-testi-slide[data-devminds-nw-km-offset="2"] {
        opacity: 0;
        pointer-events: none;
    }

    .devminds-nw-km-testi-slide[data-devminds-nw-km-offset="-1"] {
        transform: translateX(-340px) translateY(30px) rotate(-8deg) scale(0.95);
    }

    .devminds-nw-km-testi-slide[data-devminds-nw-km-offset="1"] {
        transform: translateX(340px) translateY(30px) rotate(8deg) scale(0.95);
    }

    .devminds-nw-km-cta-left,
    .devminds-nw-km-cta-right {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .devminds-nw-km-cta-subtext {
        margin-left: auto;
        margin-right: auto;
    }

    .devminds-nw-km-cta-image {
        max-width: 100%;
    }
    
    /* ================= CTA - TABLET ================= */

    .devminds-nw-km-cta {
        padding: 60px 24px;
    }
    
    .devminds-nw-km-cta-inner {
        flex-direction: column;
        text-align: center;
        gap: 40px;
    }
    
    .devminds-nw-km-cta-left,
    .devminds-nw-km-cta-right {
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
    }
    
    .devminds-nw-km-cta-subtext {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 40px;
    }
    
    .devminds-nw-km-cta-right {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    .devminds-nw-km-cta-image-stack {
        width: 100%;
        max-width: 500px;
        margin: 0 auto;
    
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    .devminds-nw-km-footer {
        padding: 50px 20px 0;
    }

    .devminds-nw-km-footer-top {
        grid-template-columns: 1fr 1fr;
        row-gap: 40px;
    }
    
    .devminds-nw-km-talent {
        padding: 60px 0 70px;
    }
    .devminds-nw-km-talent__subtext {
        margin-bottom: 40px;
    }
    
    .devminds-nw-km-talent__cta-img {
        min-height: 280px;
    }

}


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

    .devminds-nw-km-projects-image-wrap {
        min-height: 340px;
    }
}


@media (max-width: 600px) {
    .devminds-nw-km-page h1 { font-size: 38px; line-height: 1.2; }
    .devminds-nw-km-page h2 { font-size: 30px; line-height: 38px; }
    .devminds-nw-km-page h3 { font-size: 26px; line-height: 33px; }
    .devminds-nw-km-page h4 { font-size: 22px; line-height: 29px; }
    .devminds-nw-km-page h5 { font-size: 19px; }
    .devminds-nw-km-page h6 { font-size: 17px; line-height: 21px; }
    .devminds-nw-km-hero-subtext,
    .devminds-nw-km-section-subtext,
    .devminds-nw-km-trusted-text {
        font-size: 15px;
    }

    .devminds-nw-km-header {
        width: calc(100% - 24px);
        top: 12px;
        border-radius: 30px;
    }
    .devminds-nw-km-header-inner {
        padding: 10px 16px;
    }
    .devminds-nw-km-logo img {
        max-height: 34px;
    }

    .devminds-nw-km-hero-trusted {
        flex-wrap: wrap;
    }
    .devminds-nw-km-hero-trusted .devminds-nw-km-trusted-text {
        font-size: 13px;
    }

    .devminds-nw-km-hero-logos-track {
        gap: 36px;
    }
    .devminds-nw-km-hero-logo-item {
        height: 22px;
    }
    
    .devminds-nw-km-hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }
    
    .devminds-nw-km-hero-btn {
        width: 100%;
        text-align: center;
    }
    
    .devminds-nw-km-mobile-btn {
        align-self: stretch;
    }
    
    .devminds-nw-km-hero-right {
        height: 380px;
    }
    
    .devminds-nw-km-hero-globe-viz {
        position: relative !important;
        top: 50%;
        left: 50%;
        width: 175%;
        height: 175%;
        transform: translate(-50%, -15%) !important;
    }
    
    .scene-container {
        height: 600px !important;
    }
    
    .devminds-nw-km-hero-logos-wrapper {
        margin-top: -150px;
    }
    
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(1) {
        top: 5%;
        left: 7%;
    }
    
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(2) {
        top: 25%;
        left: 35%;
    }
    
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(3) {
        top: 45%;
        left: 7%;
    }
    
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card {
        transform: scale(0.7) !important;
    }
    
    .devminds-nw-km-navbar-btn.devminds-nw-km-btn-text.devminds-nw-km-navbar-btn-header {
        display: none;
    }
    
    .devminds-nw-km-impact {
        padding: 50px 20px;
    }

    .devminds-nw-km-impact-grid {
        grid-template-columns: 1fr;
        row-gap: 32px;
    }

    .devminds-nw-km-impact-item {
        border-left: none !important;
        padding: 0 !important;
        text-align: left;
    }

    .devminds-nw-km-impact-decor {
        width: 28px;
    }
    
    .devminds-nw-km-why {
        padding: 50px 16px;
    }

    .devminds-nw-km-why-subtext {
        margin-bottom: 40px;
    }

    .devminds-nw-km-why-item {
        padding: 18px;
    }

    .devminds-nw-km-why-item-desc {
        font-size: 15px;
    }

    .devminds-nw-km-why-image-wrap {
        min-height: 450px;
        width: 100%;
    }
    
    .devminds-nw-km-services-track {
        gap: 14px;
    }

    .devminds-nw-km-services-card {
        width: 200px;
    }
    
    .devminds-nw-km-services-card-title-wrap {
        padding: 18px 18px 14px;
    }

    .devminds-nw-km-services-card-img {
        height: 150px;
    }
    
    .devminds-nw-km-how {
        padding: 50px 16px;
    }

    .devminds-nw-km-how-tabs {
        padding: 16px;
    }

    .devminds-nw-km-how-tab-btn {
        padding: 10px 12px;
    }

    .devminds-nw-km-how-tab-btn span {
        font-size: 14px;
    }

    .devminds-nw-km-how-panel {
        padding: 22px;
    }

    .devminds-nw-km-how-panel-icon {
        width: 46px;
        height: 46px;
        margin-bottom: 20px;
    }

    .devminds-nw-km-how-panel-desc {
        font-size: 15px;
    }

    .devminds-nw-km-how-panel-btn {
        display: block;
        text-align: center;
        padding: 14px 20px;
    }
    
    .devminds-nw-km-projects-tabs {
        gap: 8px;
    }

    .devminds-nw-km-projects-tab {
        font-size: 13px;
        padding: 8px 14px;
    }

    .devminds-nw-km-projects-slide {
        padding: 20px;
    }

    .devminds-nw-km-projects-slide-title {
        font-size: 19px;
    }

    .devminds-nw-km-projects-meta {
        flex-wrap: wrap;
        gap: 16px;
    }

    .devminds-nw-km-projects-meta-item {
        padding-left: 16px;
    }

    .devminds-nw-km-projects-image-wrap {
        min-height: 260px;
    }

    .devminds-nw-km-projects-bottom {
        flex-wrap: wrap;
        gap: 16px;
    }

    .devminds-nw-km-projects-toggle-btn {
        font-size: 15px;
        padding: 6px 14px;
    }

    .devminds-nw-km-projects-toggle-btn.devminds-nw-km-active {
        padding: 6px 26px;
    }
    

    .devminds-nw-km-projects-tabs-wrap.devminds-nw-km-is-dropdown {
        position: relative;
        margin-bottom: 20px;
    }

    .devminds-nw-km-projects-tabs-wrap.devminds-nw-km-is-dropdown .devminds-nw-km-projects-tabs-toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        background-color: var(--devminds-nw-km-color-white);
        border: 1px solid var(--devminds-nw-km-color-border);
        border-radius: 30px;
        padding: 12px 20px;
        cursor: pointer;
        font-family: var(--devminds-nw-km-font);
    }

    .devminds-nw-km-projects-tabs-toggle-label {
        font-size: 14px;
        font-weight: 500;
        color: var(--devminds-nw-km-color-dark);
    }

    .devminds-nw-km-projects-tabs-chevron {
        width: 8px;
        height: 8px;
        border-right: 1.5px solid var(--devminds-nw-km-color-dark);
        border-bottom: 1.5px solid var(--devminds-nw-km-color-dark);
        transform: rotate(45deg);
        transition: transform 0.25s ease;
        flex-shrink: 0;
    }

    .devminds-nw-km-projects-tabs-wrap.devminds-nw-km-open .devminds-nw-km-projects-tabs-chevron {
        transform: rotate(-135deg);
    }

    /* Dropdown list — hidden by default, shown when open */
    .devminds-nw-km-projects-tabs-wrap.devminds-nw-km-is-dropdown .devminds-nw-km-projects-tabs {
        position: absolute;
        top: calc(100% + 8px);
        left: 0;
        right: 0;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        background-color: var(--devminds-nw-km-color-white);
        border: 1px solid var(--devminds-nw-km-color-border);
        border-radius: 14px;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
        padding: 8px;
        margin-bottom: 0;
        z-index: 50;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-8px);
        transition: all 0.25s ease;
    }

    .devminds-nw-km-projects-tabs-wrap.devminds-nw-km-is-dropdown.devminds-nw-km-open .devminds-nw-km-projects-tabs {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .devminds-nw-km-projects-tabs-wrap.devminds-nw-km-is-dropdown .devminds-nw-km-projects-tab {
        width: 100%;
        text-align: left;
        border: none;
        border-radius: 8px;
        padding: 12px 14px;
    }

    .devminds-nw-km-projects-tabs-wrap.devminds-nw-km-is-dropdown .devminds-nw-km-projects-tab.devminds-nw-km-active {
        background-color: var(--devminds-nw-km-color-light-bg);
        color: var(--devminds-nw-km-color-blue);
    }
    
    .devminds-nw-km-projects-subcats-wrap {
          border-radius: 20px;
        padding: 16px;
    }
    
    .devminds-nw-km-projects-subcat {
        font-size: 13px;
        padding: 6px 14px;
    }
    
    .devminds-nw-km-projects-subcat-icon {
        width: 16px;
        height: 16px;
    }
    
    .devminds-nw-km-projects-subcat-arrow {
        width: 26px;
        height: 26px;
    }
    
    .devminds-nw-km-testi {
        padding: 50px 0;
    }
    
    .devminds-nw-km-projects-subcat-row {
        flex-wrap: wrap;
        row-gap: 12px;
    }
    
    .devminds-nw-km-projects-subcat-label {
        flex: 0 0 100%;
    }
    
    .devminds-nw-km-projects-subcat-scroll-wrap {
        flex: 1 1 100%;
    }

    .devminds-nw-km-testi-heading-wrap {
        padding: 0 20px;
    }

    .devminds-nw-km-testi-subtext {
        margin-bottom: 36px;
    }

    .devminds-nw-km-testi-slide {
        width: 260px;
        padding: 20px;
    }

    .devminds-nw-km-testi-track {
        height: 340px;
    }
    
    .devminds-nw-km-testi-nav{
        margin-top: 40px;
    }

    /* Mobile — keep just center + 1 on each side, tighter curve so nothing overflows */
    .devminds-nw-km-testi-slide[data-devminds-nw-km-offset="-1"] {
        transform: translateX(-265px) translateY(30px) rotate(-6deg) scale(0.9);
        opacity: 0.5;
    }

    .devminds-nw-km-testi-slide[data-devminds-nw-km-offset="1"] {
        transform: translateX(265px) translateY(30px) rotate(6deg) scale(0.9);
        opacity: 0.5;
    }

    .devminds-nw-km-testi-content {
        font-size: 14px;
        line-height: 21px;
    }
    
    /* ================= CTA - MOBILE ================= */

    .devminds-nw-km-cta {
        padding: 40px 20px;
    }
    
    .devminds-nw-km-cta-inner {
        gap: 32px;
    }
    
    .devminds-nw-km-cta-heading {
        margin-bottom: 18px;
    }
    
    .devminds-nw-km-cta-subtext {
        font-size: 16px;
        line-height: 1.6;
        margin-bottom: 32px;
    }
    
    .devminds-nw-km-cta-btn {
        display: block;
        width: 100%;
        text-align: center;
        padding: 14px 20px;
    }
    
    .devminds-nw-km-cta-right {
        display: flex !important;
        width: 100%;
        max-width: 100%;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    .devminds-nw-km-cta-image-stack {
        width: 100%;
        max-width: 400px;
    
        /*
         * Important:
         * Maintains a proper visible area
         * for absolute positioned animated images
         */
        aspect-ratio: 1 / 1;
    
        margin: 0 auto;
    
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    .devminds-nw-km-cta-image {
        display: block !important;
    
        width: 100%;
        height: 100%;
    
        max-width: none !important;
    
        object-fit: contain;
    
        visibility: hidden;
        opacity: 0;
    }
    
    .devminds-nw-km-cta-image.devminds-nw-km-active {
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    .devminds-nw-km-footer {
        padding: 40px 20px 0;
    }

    .devminds-nw-km-footer-top {
        grid-template-columns: 1fr;
        row-gap: 32px;
    }

    .devminds-nw-km-footer-bottom {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .devminds-nw-km-footer-legal {
        gap: 16px;
    }
    
    .devminds-nw-km-talent {
        padding: 50px 0 60px;
    }
    .devminds-nw-km-talent__inner {
        padding: 0 20px;
    }
    .devminds-nw-km-talent__track {
        gap: 16px;
    }

    .devminds-nw-km-talent__card .devminds-nw-km-talent__designation {
        font-size: 19px;
    }
    .devminds-nw-km-talent__cta-img {
        min-height: 260px;
    }
    
}
@media (max-width: 480px) {

    .devminds-nw-km-projects-image-wrap {
        min-height: 200px;
    }
    
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(1) {
        top: 5%;
        left: -5%;
    }
    
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(2) {
        top: 25%;
        left: 15%;
    }
    
    .devminds-nw-km-hero-cards-overlay .devminds-nw-km-globe-card:nth-child(3) {
        top: 45%;
        left: -5%;
    }
}