/*
 * Emdify frontend refresh.
 * Scoped classes keep the new homepage/header/footer from fighting the old theme.
 */

:root {
    --em-navy: #071126;
    --em-navy-2: #0d1730;
    --em-ink: #151c2f;
    --em-muted: #657089;
    --em-border: #e7ebf2;
    --em-soft: #f6f8fc;
    --em-pink: #ef174f;
    --em-pink-2: #ff4b78;
    --em-blue: #4aa3ff;
    --em-purple: #7d70ff;
    --em-shadow: 0 24px 70px rgba(9, 19, 40, 0.14);
}

body {
    background: #fff;
    padding-top: 86px;
}

.em-site-header {
    background: var(--em-navy);
    color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 50;
    box-shadow: 0 12px 40px rgba(3, 10, 24, 0.18);
}

.em-site-header .navbar {
    min-height: 86px;
    padding: 0;
    background: transparent;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.em-site-header .navbar.navbar-sticky,
.em-site-header .navbar.navbar-sticky.hidden,
.em-site-header .navbar.navbar-sticky.visible {
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.em-site-header .navbar .container {
    max-width: 1140px;
}

.em-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff !important;
    font-size: 25px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1;
}

.em-brand img {
    width: 32px;
    height: 32px;
    object-fit: contain;
}

.em-brand-dot {
    color: var(--em-pink);
}

.em-site-header .navbar-nav.items {
    align-items: center;
    margin-left: auto;
}

.em-site-header .navbar-nav.items > .nav-item {
    margin: 0 4px;
}

.em-site-header .navbar-nav.items > .nav-item > .nav-link {
    color: #f6f8ff !important;
    font-size: 14px;
    font-weight: 700;
    padding: 14px 13px;
    border-radius: 6px;
    transition: color 0.18s ease, background 0.18s ease;
}

.em-site-header .navbar-nav.items > .nav-item > .nav-link:hover,
.em-site-header .navbar-nav.items > .nav-item.active > .nav-link {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.08);
}

.em-site-header .navbar-nav.items > .nav-item > .nav-link.em-services-trigger {
    color: #fff !important;
    padding-left: 22px;
    padding-right: 22px;
}

.em-site-header .navbar-nav.items > .nav-item.active > .nav-link.em-services-trigger {
    background: var(--em-pink);
    box-shadow: 0 12px 28px rgba(239, 23, 79, 0.28);
}

.em-site-header .dropdown-menu {
    background: transparent;
    border: 0;
    margin-top: 0;
}

.em-site-header .navbar-nav.items > .dropdown > .dropdown-menu:not(.em-mega-menu) {
    min-width: 240px;
    padding: 10px;
    background: var(--em-navy);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0 0 8px 8px;
    box-shadow: 0 24px 50px rgba(0, 0, 0, 0.3);
}

.em-site-header .navbar-nav.items > .dropdown > .dropdown-menu:not(.em-mega-menu) .nav-link {
    color: #fff !important;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 12px;
}

.em-site-header .navbar-nav.items > .dropdown > .dropdown-menu:not(.em-mega-menu) .nav-link:hover {
    background: var(--em-pink);
}

.em-site-header .dropdown-menu.em-mega-menu {
    position: fixed !important;
    top: 74px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: min(1060px, calc(100vw - 40px));
    max-width: calc(100vw - 40px);
    padding: 12px 0 0;
    z-index: 80;
}

.em-site-header .dropdown-menu.em-mega-menu::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -14px;
    height: 14px;
}

.em-compact-mega-menu {
    width: min(1060px, calc(100vw - 40px));
}

.em-mega-panel {
    background: var(--em-navy);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0 0 8px 8px;
    box-shadow: 0 28px 60px rgba(0, 0, 0, 0.35);
    padding: 26px;
    min-height: 270px;
}

.em-mega-kicker,
.em-section-kicker {
    color: var(--em-pink);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.em-mega-title {
    color: #fff;
    font-size: 22px;
    font-weight: 800;
    margin: 6px 0 8px;
}

.em-mega-copy {
    color: #aab5cc;
    font-size: 13px;
    line-height: 1.7;
    margin-bottom: 18px;
}

.em-mega-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.em-mega-list-single {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.em-mega-service {
    display: flex !important;
    align-items: center;
    gap: 13px;
    min-height: 54px;
    padding: 11px 14px !important;
    color: #fff !important;
    background: #131b34;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 7px;
    text-decoration: none !important;
    transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.em-mega-service > span:not(.em-mega-icon) {
    min-width: 0;
    flex: 1;
}

.em-mega-service:hover {
    background: var(--em-pink);
    border-color: var(--em-pink);
    transform: translateY(-2px);
}

.em-mega-icon,
.em-service-icon,
.em-process-icon,
.em-stat-icon,
.em-footer-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.em-mega-icon {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(135deg, var(--em-blue), var(--em-purple));
    font-size: 16px;
}

.em-mega-service strong {
    color: #fff;
    display: block;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.em-mega-service span:not(.em-mega-icon) {
    color: #b8c2d8;
    display: block;
    font-size: 12px;
    line-height: 1.35;
    margin-top: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.em-header-icons .nav-link {
    color: #fff !important;
    font-size: 17px;
    padding: 10px;
}

.em-header-action {
    margin-left: 18px;
}

.em-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-radius: 5px;
    min-height: 44px;
    padding: 12px 21px;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.em-btn:hover {
    transform: translateY(-2px);
}

.em-btn-primary {
    color: #fff !important;
    background: var(--em-pink);
    border: 1px solid var(--em-pink);
    box-shadow: 0 14px 28px rgba(239, 23, 79, 0.22);
}

.em-btn-primary:hover {
    color: #fff !important;
    background: #d91145;
}

.em-btn-outline {
    color: #fff !important;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.35);
}

.em-btn-outline:hover {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.08);
}

.em-btn-light {
    color: var(--em-pink) !important;
    background: #fff;
    border: 1px solid #fff;
    box-shadow: 0 18px 36px rgba(86, 5, 28, 0.16);
}

.em-btn-light:hover {
    color: var(--em-pink) !important;
    background: #fff;
}

.em-toggle .nav-link {
    color: #fff !important;
    border: 1px solid rgba(239, 23, 79, 0.7);
    border-radius: 5px;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.em-home {
    color: var(--em-ink);
    background: #fff;
}

.em-hero {
    position: relative;
    overflow: hidden;
    padding: 86px 0 64px;
    color: #fff;
    background:
        radial-gradient(circle at 80% 20%, rgba(64, 114, 255, 0.28), transparent 30%),
        radial-gradient(circle at 15% 25%, rgba(239, 23, 79, 0.14), transparent 26%),
        linear-gradient(135deg, #061024 0%, #071229 48%, #0b1832 100%);
    background-size: 140% 140%;
    animation: emHeroGradient 16s ease-in-out infinite alternate;
}

.em-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: linear-gradient(to bottom, black, transparent 88%);
    animation: emGridDrift 18s linear infinite;
}

.em-hero::after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    right: -140px;
    top: 70px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(74, 163, 255, 0.22), transparent 68%);
    filter: blur(6px);
    animation: emOrbFloat 9s ease-in-out infinite;
}

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

.em-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #c9d5ee;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    padding: 9px 12px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.em-hero-title {
    max-width: 580px;
    margin: 20px 0 18px;
    color: #fff;
    font-size: clamp(38px, 4.4vw, 58px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: 0;
    animation: emFadeUp 0.75s ease both;
}

.em-gradient-text {
    background: linear-gradient(90deg, #40a8ff 0%, #8c6cff 45%, #ff4c7d 100%);
    background-size: 180% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: emTextShine 6s ease-in-out infinite alternate;
}

.em-hero-copy {
    max-width: 560px;
    color: #d3d9e8;
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 28px;
    animation: emFadeUp 0.75s ease 0.08s both;
}

.em-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 26px;
    animation: emFadeUp 0.75s ease 0.16s both;
}

.em-trust-row {
    display: flex;
    align-items: center;
    gap: 13px;
    flex-wrap: wrap;
    animation: emFadeUp 0.75s ease 0.24s both;
}

.em-avatar-stack {
    display: flex;
}

.em-avatar-stack img,
.em-avatar-stack span {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.9);
    margin-left: -8px;
    background: linear-gradient(135deg, #fff, #b9cdf7);
    object-fit: cover;
    object-position: center;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
    animation: emAvatarPop 2.8s ease-in-out infinite;
}

.em-avatar-stack img:nth-child(2),
.em-avatar-stack span:nth-child(2) {
    animation-delay: 0.16s;
}

.em-avatar-stack img:nth-child(3),
.em-avatar-stack span:nth-child(3) {
    animation-delay: 0.32s;
}

.em-avatar-stack img:nth-child(4),
.em-avatar-stack span:nth-child(4) {
    animation-delay: 0.48s;
}

.em-avatar-stack img:first-child,
.em-avatar-stack span:first-child {
    margin-left: 0;
}

.em-rating {
    color: #fff;
    font-size: 12px;
    line-height: 1.5;
}

.em-stars {
    color: #ffd24a;
    letter-spacing: 2px;
}

.em-hero-visual {
    position: relative;
}

.em-code-cloud {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
}

.em-code-chip {
    position: absolute;
    color: #dbe7ff;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 999px;
    padding: 8px 11px;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.02em;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(10px);
    animation: emCodeChipFloat 6s ease-in-out infinite;
}

.em-code-chip-one {
    left: -20px;
    top: 16%;
}

.em-code-chip-two {
    right: 14px;
    top: -18px;
    animation-delay: 0.8s;
}

.em-code-chip-three {
    right: -18px;
    bottom: 30%;
    animation-delay: 1.5s;
}

.em-solution-lab {
    position: relative;
    overflow: hidden;
    min-height: 430px;
    background:
        radial-gradient(circle at 82% 12%, rgba(74, 163, 255, 0.18), transparent 28%),
        radial-gradient(circle at 18% 88%, rgba(239, 23, 79, 0.13), transparent 26%),
        rgba(12, 20, 42, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 14px;
    padding: 22px;
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.32);
    animation: emDashboardFloat 7s ease-in-out infinite;
}

.em-solution-lab::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
    background-size: 36px 36px;
    opacity: 0.72;
    animation: emGridDrift 20s linear infinite;
}

.em-solution-lab::after {
    content: "";
    position: absolute;
    width: 280px;
    height: 280px;
    right: -100px;
    bottom: -110px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(74, 163, 255, 0.2), transparent 68%);
    animation: emOrbFloat 10s ease-in-out infinite;
}

.em-solution-lab > * {
    position: relative;
    z-index: 1;
}

.em-lab-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.em-lab-title {
    color: #fff;
    font-size: 15px;
    font-weight: 900;
    line-height: 1.35;
    max-width: 280px;
}

.em-lab-badge {
    color: #dbe6fb;
    background: rgba(74, 163, 255, 0.1);
    border: 1px solid rgba(74, 163, 255, 0.22);
    border-radius: 999px;
    padding: 7px 11px;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
    animation: emLiveBadgePulse 2.6s ease-in-out infinite;
}

.em-solution-canvas {
    position: relative;
    min-height: 332px;
}

.em-flow-lines {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.em-flow-lines path {
    fill: none;
    stroke: rgba(74, 163, 255, 0.5);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-dasharray: 7 12;
    animation: emFlowDash 3.8s linear infinite;
}

.em-flow-lines path:nth-child(2) {
    stroke: rgba(239, 23, 79, 0.44);
    animation-delay: 0.35s;
}

.em-flow-lines path:nth-child(3) {
    animation-delay: 0.7s;
}

.em-flow-lines path:nth-child(4) {
    stroke: rgba(125, 112, 255, 0.48);
    animation-delay: 1s;
}

.em-web-preview,
.em-mobile-preview,
.em-chatbot-preview,
.em-automation-preview,
.em-delivery-node {
    position: absolute;
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.2);
}

.em-web-preview {
    left: 8px;
    top: 28px;
    width: 250px;
    min-height: 168px;
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 14px;
    animation: emUiFloat 6.2s ease-in-out infinite;
}

.em-preview-top {
    display: flex;
    gap: 5px;
    margin-bottom: 12px;
}

.em-preview-top span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #ff5b68;
}

.em-preview-top span:nth-child(2) {
    background: #ffd056;
}

.em-preview-top span:nth-child(3) {
    background: #41dd86;
}

.em-preview-nav,
.em-preview-hero,
.em-preview-grid span {
    display: block;
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.12);
}

.em-preview-nav {
    width: 72%;
    height: 13px;
    margin-bottom: 12px;
}

.em-preview-hero {
    position: relative;
    height: 52px;
    margin-bottom: 12px;
    overflow: hidden;
}

.em-preview-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, transparent 20%, rgba(74, 163, 255, 0.26) 50%, transparent 76%);
    transform: translateX(-100%);
    animation: emPreviewScan 3.8s ease-in-out infinite;
}

.em-preview-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 12px;
}

.em-preview-grid span {
    height: 28px;
}

.em-web-preview strong,
.em-mobile-preview strong,
.em-automation-preview strong {
    color: #fff;
    display: block;
    font-size: 12px;
    font-weight: 900;
}

.em-mobile-preview {
    right: 38px;
    top: 42px;
    width: 112px;
    min-height: 198px;
    background: #111b33;
    border-radius: 24px;
    padding: 16px 10px 12px;
    text-align: center;
    animation: emMobileFloat 6.8s ease-in-out infinite;
}

.em-mobile-notch {
    position: absolute;
    top: 8px;
    left: 50%;
    width: 34px;
    height: 5px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.22);
    transform: translateX(-50%);
}

.em-mobile-screen {
    display: grid;
    gap: 8px;
    margin: 18px 0 12px;
}

.em-mobile-screen span {
    height: 34px;
    border-radius: 9px;
    background: linear-gradient(135deg, rgba(74, 163, 255, 0.28), rgba(125, 112, 255, 0.12));
    animation: emMobileBar 2.8s ease-in-out infinite;
}

.em-mobile-screen span:nth-child(2) {
    animation-delay: 0.28s;
}

.em-mobile-screen span:nth-child(3) {
    animation-delay: 0.56s;
}

.em-chatbot-preview {
    left: 44px;
    bottom: 28px;
    width: 238px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 14px;
    padding: 14px;
    animation: emUiFloat 7s ease-in-out infinite reverse;
}

.em-chatbot-preview i {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    color: #fff;
    background: linear-gradient(135deg, var(--em-blue), var(--em-purple));
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.em-chatbot-preview strong,
.em-chatbot-preview span {
    display: block;
}

.em-chatbot-preview strong {
    color: #fff;
    font-size: 13px;
    font-weight: 900;
}

.em-chatbot-preview span {
    color: #b8c4dc;
    font-size: 11px;
}

.em-chatbot-preview em {
    display: flex;
    gap: 4px;
    margin-left: auto;
    font-style: normal;
}

.em-chatbot-preview b {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #fff;
    opacity: 0.45;
    animation: emTypingDot 1.2s ease-in-out infinite;
}

.em-chatbot-preview b:nth-child(2) {
    animation-delay: 0.18s;
}

.em-chatbot-preview b:nth-child(3) {
    animation-delay: 0.36s;
}

.em-automation-preview {
    right: 16px;
    bottom: 46px;
    width: 226px;
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    padding: 16px;
    display: grid;
    grid-template-columns: 42px 32px 42px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    text-align: center;
    animation: emUiFloat 7.4s ease-in-out infinite;
}

.em-automation-preview span {
    width: 42px;
    height: 42px;
    color: #fff;
    background: rgba(74, 163, 255, 0.18);
    border: 1px solid rgba(74, 163, 255, 0.22);
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    animation: emAutomationPulse 2.6s ease-in-out infinite;
}

.em-automation-preview span:nth-child(2) {
    width: 32px;
    background: transparent;
    border: 0;
    color: var(--em-pink);
    animation: emAutomationArrow 1.8s ease-in-out infinite;
}

.em-automation-preview strong {
    grid-column: 1 / -1;
    margin-top: 2px;
}

.em-delivery-node {
    right: 178px;
    top: 142px;
    width: 78px;
    height: 78px;
    color: #fff;
    background: linear-gradient(135deg, var(--em-pink), var(--em-purple));
    border-radius: 50%;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    animation: emLaunchPulse 2.8s ease-in-out infinite;
}

.em-delivery-node i {
    font-size: 22px;
}

.em-delivery-node span {
    font-size: 10px;
    font-weight: 900;
}

.em-dashboard {
    position: relative;
    overflow: hidden;
    background: rgba(12, 20, 42, 0.88);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 14px;
    padding: 22px;
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.32);
    animation: emDashboardFloat 7s ease-in-out infinite;
}

.em-dashboard::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(120deg, transparent 0%, rgba(74, 163, 255, 0.16) 46%, transparent 62%);
    transform: translateX(-120%);
    animation: emDashboardScan 5.8s ease-in-out infinite;
    pointer-events: none;
}

.em-dashboard > * {
    position: relative;
    z-index: 1;
}

.em-window-dots {
    display: flex;
    gap: 6px;
    margin-bottom: 18px;
}

.em-window-dots span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ef4d5d;
}

.em-window-dots span:nth-child(2) {
    background: #ffcc4d;
}

.em-window-dots span:nth-child(3) {
    background: #38d875;
}

.em-dashboard-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.em-dashboard-title {
    color: #fff;
    font-size: 15px;
    font-weight: 800;
}

.em-dashboard-badge {
    color: #aeb9d0;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 11px;
    animation: emLiveBadgePulse 2.6s ease-in-out infinite;
}

.em-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 22px;
}

.em-kpi {
    background: rgba(255, 255, 255, 0.06);
    border-radius: 8px;
    padding: 14px;
    transition: transform 0.2s ease, background 0.2s ease;
}

.em-kpi:hover {
    background: rgba(255, 255, 255, 0.09);
    transform: translateY(-3px);
}

.em-kpi span {
    display: block;
    color: #a6b2ca;
    font-size: 11px;
    margin-bottom: 8px;
}

.em-kpi strong {
    color: #fff;
    font-size: 22px;
}

.em-chart {
    height: 150px;
    border-radius: 10px;
    background:
        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: 100% 25%, 16.66% 100%;
    position: relative;
    overflow: hidden;
}

.em-chart svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.em-chart path:last-child {
    stroke-dasharray: 700;
    stroke-dashoffset: 700;
    animation: emDrawChart 2.2s ease 0.6s forwards;
}

.em-feature-strip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-top: 18px;
}

.em-feature-mini {
    display: flex;
    gap: 12px;
    align-items: center;
    background: rgba(255, 255, 255, 0.09);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    padding: 14px;
    animation: emFadeUp 0.7s ease both;
}

.em-feature-mini:nth-child(2) {
    animation-delay: 0.12s;
}

.em-feature-mini:nth-child(3) {
    animation-delay: 0.24s;
}

.em-feature-mini i {
    color: #fff;
    background: linear-gradient(135deg, var(--em-blue), var(--em-purple));
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    font-size: 18px;
}

.em-feature-mini strong {
    color: #fff;
    display: block;
    font-size: 13px;
    margin-bottom: 3px;
}

.em-feature-mini span {
    color: #b3bed4;
    font-size: 11px;
}

.em-logo-band {
    background:
        radial-gradient(circle at 12% 0%, rgba(74, 163, 255, 0.08), transparent 24%),
        #fff;
    border-bottom: 1px solid var(--em-border);
    padding: 22px 0;
    overflow: hidden;
}

.em-logo-band p {
    color: #8a94aa;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.em-logo-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.em-logo-slider::before,
.em-logo-slider::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 2;
    width: min(110px, 12vw);
    pointer-events: none;
}

.em-logo-slider::before {
    left: 0;
    background: linear-gradient(90deg, #fff, rgba(255, 255, 255, 0));
}

.em-logo-slider::after {
    right: 0;
    background: linear-gradient(270deg, #fff, rgba(255, 255, 255, 0));
}

.em-logo-track {
    display: flex;
    align-items: center;
    gap: 18px;
    width: max-content;
    animation: emLogoMarquee 28s linear infinite;
}

.em-logo-slider:hover .em-logo-track {
    animation-play-state: paused;
}

.em-logo-item {
    width: clamp(170px, 15vw, 230px);
    min-height: 72px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid var(--em-border);
    border-radius: 8px;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.em-logo-item:hover {
    border-color: rgba(74, 163, 255, 0.28);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.1);
    transform: translateY(-4px);
}

.em-logo-item img {
    max-width: 132px;
    max-height: 44px;
    object-fit: contain;
    filter: grayscale(1) saturate(0.25) opacity(0.72);
    transition: filter 0.18s ease, transform 0.18s ease;
}

.em-logo-item:hover img {
    filter: grayscale(0) saturate(1) opacity(1);
    transform: scale(1.04);
}

.em-section {
    padding: 72px 0;
}

.em-section-soft {
    background: var(--em-soft);
}

.em-services-showcase {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 8%, rgba(74, 163, 255, 0.08), transparent 24%),
        radial-gradient(circle at 90% 18%, rgba(239, 23, 79, 0.07), transparent 25%),
        linear-gradient(180deg, #fff 0%, #fbfcff 100%);
}

.em-services-showcase::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(74, 163, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(74, 163, 255, 0.08) 1px, transparent 1px);
    background-size: 48px 48px;
    opacity: 0.45;
    animation: emCodeGridMove 18s linear infinite;
    pointer-events: none;
}

.em-services-showcase::after {
    content: "</>";
    position: absolute;
    right: 6%;
    top: 46px;
    color: rgba(7, 17, 38, 0.045);
    font-size: 112px;
    font-weight: 900;
    line-height: 1;
    animation: emCodeFloat 7s ease-in-out infinite;
    pointer-events: none;
}

.em-services-showcase .container {
    position: relative;
    z-index: 1;
}

.em-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 28px;
}

.em-section-title {
    color: var(--em-ink);
    font-size: clamp(30px, 4vw, 42px);
    font-weight: 900;
    line-height: 1.15;
    margin: 8px 0 8px;
}

.em-section-copy {
    color: var(--em-muted);
    font-size: 14px;
    line-height: 1.7;
    margin: 0;
}

.em-service-card,
.em-project-card,
.em-testimonial-card,
.em-blog-card {
    background: #fff;
    border: 1px solid var(--em-border);
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.em-service-card:hover,
.em-project-card:hover,
.em-blog-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--em-shadow);
    border-color: rgba(239, 23, 79, 0.28);
}

.em-service-card {
    height: 100%;
    padding: 28px 22px;
    text-align: center;
}

.em-service-dev-card {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(135deg, rgba(74, 163, 255, 0.32), rgba(239, 23, 79, 0.18)) border-box;
    border: 1px solid transparent;
}

.em-service-dev-card::before {
    content: "";
    position: absolute;
    top: 18px;
    right: 18px;
    width: 82px;
    height: 58px;
    opacity: 0.22;
    background:
        linear-gradient(90deg, rgba(74, 163, 255, 0.55) 1px, transparent 1px),
        linear-gradient(rgba(239, 23, 79, 0.35) 1px, transparent 1px);
    background-size: 16px 16px;
    border-radius: 10px;
    transform: rotate(-7deg);
    transition: opacity 0.2s ease, transform 0.2s ease;
    pointer-events: none;
}

.em-service-dev-card::after {
    content: "";
    position: absolute;
    top: -90%;
    left: -35%;
    width: 170%;
    height: 64%;
    background: linear-gradient(110deg, transparent 20%, rgba(74, 163, 255, 0.16) 48%, transparent 70%);
    transform: rotate(10deg);
    opacity: 0;
    pointer-events: none;
}

.em-services-showcase.is-visible .em-service-dev-card::after {
    animation: emServiceScan 4.4s ease-in-out infinite;
}

.em-service-dev-card:hover::before {
    opacity: 0.42;
    transform: rotate(0deg) translateY(-3px);
}

.em-service-dev-card > * {
    position: relative;
    z-index: 1;
}

.em-service-icon {
    width: 72px;
    height: 72px;
    margin: 0 auto 18px;
    border-radius: 16px;
    color: #0a1730;
    background: #eef5ff;
    border: 1px solid #d7e7ff;
    font-size: 34px;
}

.em-service-dev-card .em-service-icon {
    position: relative;
    background:
        linear-gradient(#eef5ff, #eef5ff) padding-box,
        linear-gradient(135deg, rgba(74, 163, 255, 0.45), rgba(239, 23, 79, 0.2)) border-box;
    border: 1px solid transparent;
    box-shadow: 0 12px 28px rgba(74, 163, 255, 0.12);
    animation: emIconPulse 3s ease-in-out infinite;
}

.em-service-dev-card .em-service-icon::before {
    content: "";
    position: absolute;
    inset: -9px;
    border: 1px dashed rgba(74, 163, 255, 0.35);
    border-radius: 21px;
    opacity: 0;
    transform: scale(0.86);
}

.em-services-showcase.is-visible .em-service-dev-card .em-service-icon::before {
    animation: emNodeRing 2.8s ease-in-out infinite;
}

.em-service-dev-card:hover .em-service-icon {
    color: #fff;
    background:
        linear-gradient(135deg, var(--em-blue), var(--em-pink)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.12)) border-box;
    box-shadow: 0 18px 38px rgba(74, 163, 255, 0.28);
}

.em-service-card h3 {
    color: var(--em-ink);
    font-size: 17px;
    font-weight: 900;
    margin-bottom: 10px;
}

.em-service-card p {
    color: var(--em-muted);
    font-size: 13px;
    line-height: 1.65;
    min-height: 62px;
}

.em-link {
    color: var(--em-pink) !important;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none !important;
}

#main .em-btn,
#main .em-link {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 44px;
    padding: 12px 21px;
    color: #fff !important;
    background: linear-gradient(135deg, var(--em-pink) 0%, #f73568 52%, #c70940 100%);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    box-shadow: 0 16px 34px rgba(239, 23, 79, 0.24);
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none !important;
    transform: translateZ(0);
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

#main .em-link {
    min-height: 38px;
    padding: 10px 15px;
    font-size: 12px;
    box-shadow: 0 12px 24px rgba(239, 23, 79, 0.18);
}

#main .em-btn::before,
#main .em-link::before {
    content: "";
    position: absolute;
    inset: -2px;
    z-index: -1;
    background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, 0.28) 42%, transparent 62%);
    transform: translateX(-125%);
    transition: transform 0.55s ease;
}

#main .em-btn::after,
#main .em-link::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.42);
    opacity: 0;
    transform: translate(-50%, -50%) scale(0);
    pointer-events: none;
}

#main .em-btn:hover,
#main .em-link:hover {
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.28);
    box-shadow: 0 22px 44px rgba(239, 23, 79, 0.32);
    transform: translateY(-3px);
}

#main .em-btn:hover::before,
#main .em-link:hover::before {
    transform: translateX(125%);
}

#main .em-btn:active,
#main .em-link:active {
    box-shadow: 0 10px 22px rgba(239, 23, 79, 0.24);
    transform: translateY(-1px) scale(0.97);
}

#main .em-btn.em-button-clicked::after,
#main .em-link.em-button-clicked::after {
    animation: emButtonRipple 0.42s ease-out;
}

#main .em-btn i,
#main .em-link i {
    position: relative;
    z-index: 1;
    transition: transform 0.18s ease;
}

#main .em-btn:hover i,
#main .em-link:hover i {
    transform: translateX(3px);
}

#main .em-btn-outline {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.38);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04), 0 14px 28px rgba(7, 17, 38, 0.18);
}

#main .em-btn-outline:hover {
    background: rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 18px 34px rgba(7, 17, 38, 0.24);
}

#main .em-btn-light {
    color: var(--em-pink) !important;
    background: #fff;
    border-color: #fff;
    box-shadow: 0 18px 36px rgba(86, 5, 28, 0.16);
}

#main .em-btn-light:hover {
    color: var(--em-pink) !important;
    background: #fff;
    box-shadow: 0 22px 44px rgba(86, 5, 28, 0.22);
}

#main .em-btn-light::before {
    background: linear-gradient(115deg, transparent 0%, rgba(239, 23, 79, 0.12) 42%, transparent 62%);
}

#main .em-btn-light::after {
    background: rgba(239, 23, 79, 0.18);
}

.em-stats-bar {
    margin-top: 26px;
    background: var(--em-navy);
    border-radius: 8px;
    padding: 24px 18px;
    box-shadow: 0 16px 40px rgba(7, 17, 38, 0.25);
}

.em-dev-stats {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(135deg, #061024 0%, #07142d 50%, #0b1835 100%);
}

.em-dev-stats::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(74, 163, 255, 0.24) 50%, transparent 100%);
    transform: translateX(-100%);
    animation: emStatsSweep 4.8s linear infinite;
    pointer-events: none;
}

.em-dev-stats::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: 34px 34px;
    opacity: 0.22;
    pointer-events: none;
}

.em-dev-stats .row {
    position: relative;
    z-index: 1;
}

.em-stat-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    color: #fff;
    border-right: 1px solid rgba(255, 255, 255, 0.12);
}

.em-dev-stats .em-stat-item {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 0.48s ease, transform 0.48s ease;
}

.em-services-showcase.is-visible .em-dev-stats .em-stat-item {
    opacity: 1;
    transform: translateY(0);
}

.em-services-showcase.is-visible .em-dev-stats .em-stat-item:nth-child(2) {
    transition-delay: 0.08s;
}

.em-services-showcase.is-visible .em-dev-stats .em-stat-item:nth-child(3) {
    transition-delay: 0.16s;
}

.em-services-showcase.is-visible .em-dev-stats .em-stat-item:nth-child(4) {
    transition-delay: 0.24s;
}

.em-services-showcase.is-visible .em-dev-stats .em-stat-item:nth-child(5) {
    transition-delay: 0.32s;
}

.em-stat-item:last-child {
    border-right: 0;
}

.em-stat-icon {
    color: #80a6ff;
    font-size: 29px;
}

.em-services-showcase.is-visible .em-dev-stats .em-stat-icon {
    animation: emStatIconPulse 2.6s ease-in-out infinite;
}

.em-stat-item strong {
    display: block;
    color: #fff;
    font-size: 26px;
    line-height: 1;
}

.em-stat-item span {
    color: #b6c1d6;
    display: block;
    font-size: 12px;
    margin-top: 4px;
}

.em-mission-list {
    list-style: none;
    padding: 0;
    margin: 22px 0 24px;
}

.em-mission-list li {
    color: var(--em-ink);
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    margin-bottom: 11px;
}

.em-mission-list i {
    color: var(--em-pink);
}

.em-mission-panel {
    position: relative;
    overflow: hidden;
    height: 100%;
    padding: 38px 34px;
    color: #fff;
    background:
        radial-gradient(circle at 14% 12%, rgba(255, 255, 255, 0.22), transparent 21%),
        radial-gradient(circle at 96% 88%, rgba(6, 17, 38, 0.22), transparent 28%),
        linear-gradient(135deg, var(--em-pink) 0%, #d70f43 58%, #b90d3b 100%);
    border-radius: 10px;
    box-shadow: 0 30px 70px rgba(239, 23, 79, 0.28);
}

.em-mission-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.1) 1px, transparent 1px);
    background-size: 34px 34px;
    opacity: 0.22;
}

.em-mission-panel > * {
    position: relative;
    z-index: 1;
}

.em-mission-panel .em-section-kicker,
.em-mission-panel .em-section-title,
.em-mission-panel .em-section-copy,
.em-mission-panel .em-mission-list li {
    color: #fff;
}

.em-mission-panel .em-section-kicker {
    opacity: 0.85;
}

.em-mission-panel .em-section-copy,
.em-mission-panel .em-mission-list li {
    color: rgba(255, 255, 255, 0.88);
}

.em-mission-panel .em-mission-list i {
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    border-radius: 50%;
    padding: 3px;
}

.em-mission-mini {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 4px 0 24px;
    padding: 16px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;
}

.em-mission-mini strong {
    color: #fff;
    font-size: 32px;
    line-height: 1;
}

.em-mission-mini span {
    color: rgba(255, 255, 255, 0.84);
    font-size: 13px;
    line-height: 1.45;
}

.em-process-section-row {
    row-gap: 28px;
}

.em-process-panel {
    position: relative;
    height: 100%;
    min-height: 100%;
    padding: 8px 0 4px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.em-process-row {
    position: relative;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-top: 26px;
}

.em-process-row::before {
    content: "";
    position: absolute;
    top: 35px;
    left: 6%;
    right: 6%;
    height: 2px;
    background: linear-gradient(90deg, rgba(239, 23, 79, 0.14), rgba(74, 163, 255, 0.3), rgba(239, 23, 79, 0.14));
}

.em-process-card {
    position: relative;
    min-height: 168px;
    text-align: center;
    padding: 0 6px;
    z-index: 1;
}

.em-process-card:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 29px;
    right: -20px;
    width: 36px;
    height: 14px;
    background: linear-gradient(90deg, var(--em-blue), var(--em-pink));
    clip-path: polygon(0 42%, 72% 42%, 72% 18%, 100% 50%, 72% 82%, 72% 58%, 0 58%);
    opacity: 0;
    transform: translateX(-12px);
    z-index: 2;
}

.em-process-row.is-visible .em-process-card:not(:last-child)::after {
    animation: emProcessArrow 1.55s ease-in-out infinite;
}

.em-process-row.is-visible .em-process-card:nth-child(1)::after {
    animation-delay: 0.05s;
}

.em-process-row.is-visible .em-process-card:nth-child(2)::after {
    animation-delay: 0.25s;
}

.em-process-row.is-visible .em-process-card:nth-child(3)::after {
    animation-delay: 0.45s;
}

.em-process-row.is-visible .em-process-card:nth-child(4)::after {
    animation-delay: 0.65s;
}

.em-process-row.is-visible .em-process-card:nth-child(5)::after {
    animation-delay: 0.85s;
}

.em-process-icon {
    position: relative;
    width: 70px;
    height: 70px;
    margin: 0 auto 14px;
    color: var(--em-blue);
    background: #fff;
    border: 1px solid var(--em-border);
    border-radius: 50%;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
    font-size: 26px;
    transition: transform 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.em-process-icon::before {
    content: "";
    position: absolute;
    inset: -7px;
    border-radius: inherit;
    border: 1px solid rgba(74, 163, 255, 0.18);
    transform: scale(0.92);
    opacity: 0;
}

.em-process-row.is-visible .em-process-icon::before {
    animation: emProcessPulse 2.4s ease-in-out infinite;
}

.em-process-row.is-visible .em-process-card:nth-child(2) .em-process-icon::before {
    animation-delay: 0.18s;
}

.em-process-row.is-visible .em-process-card:nth-child(3) .em-process-icon::before {
    animation-delay: 0.36s;
}

.em-process-row.is-visible .em-process-card:nth-child(4) .em-process-icon::before {
    animation-delay: 0.54s;
}

.em-process-row.is-visible .em-process-card:nth-child(5) .em-process-icon::before {
    animation-delay: 0.72s;
}

.em-process-row.is-visible .em-process-card:nth-child(6) .em-process-icon::before {
    animation-delay: 0.9s;
}

.em-process-card:hover .em-process-icon {
    color: #fff;
    background: linear-gradient(135deg, var(--em-blue), var(--em-pink));
    transform: translateY(-4px);
    box-shadow: 0 18px 36px rgba(74, 163, 255, 0.22);
}

.em-process-card strong {
    display: block;
    color: var(--em-ink);
    font-size: 13px;
    margin-bottom: 7px;
}

.em-process-card p {
    color: var(--em-muted);
    font-size: 11.5px;
    line-height: 1.45;
    max-width: 112px;
    margin: 0 auto;
}

.em-project-card {
    overflow: hidden;
    height: 100%;
    position: relative;
}

.em-project-image,
.em-blog-image {
    position: relative;
    overflow: hidden;
    background: #dfe6f3;
}

.em-project-image::before,
.em-blog-image::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, 0.55) 46%, transparent 62%);
    transform: translateX(-130%);
    transition: transform 0.72s ease;
    pointer-events: none;
}

.em-project-image::after,
.em-blog-image::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 52%;
    background: linear-gradient(to top, rgba(7, 17, 38, 0.46), transparent);
    pointer-events: none;
}

.em-project-image {
    height: 210px;
}

.em-project-image img,
.em-blog-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.01);
    transition: transform 0.42s ease, filter 0.42s ease;
}

.em-project-card:hover .em-project-image::before,
.em-blog-card:hover .em-blog-image::before {
    transform: translateX(130%);
}

.em-project-card:hover .em-project-image img,
.em-blog-card:hover .em-blog-image img {
    filter: saturate(1.08) contrast(1.03);
    transform: scale(1.07);
}

.em-project-pill {
    position: absolute;
    z-index: 2;
    left: 18px;
    bottom: 16px;
    color: #fff;
    background: var(--em-pink);
    border-radius: 999px;
    padding: 7px 12px;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 12px 24px rgba(239, 23, 79, 0.25);
}

.em-project-body {
    padding: 22px;
}

.em-project-body h3,
.em-blog-body h3 {
    color: var(--em-ink);
    font-size: 17px;
    font-weight: 900;
    margin-bottom: 10px;
}

.em-project-body p,
.em-blog-body p {
    color: var(--em-muted);
    font-size: 13px;
    line-height: 1.65;
}

.em-project-meta {
    border-top: 1px solid var(--em-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 18px;
    padding-top: 16px;
}

.em-project-meta span {
    color: var(--em-muted);
    font-size: 12px;
}

.em-testimonial-showcase {
    position: relative;
    overflow: hidden;
    color: #fff;
    background:
        radial-gradient(circle at 12% 16%, rgba(255, 255, 255, 0.18), transparent 26%),
        radial-gradient(circle at 86% 20%, rgba(74, 163, 255, 0.14), transparent 24%),
        linear-gradient(135deg, #f21652 0%, #d50b45 48%, #8b0834 100%);
}

.em-testimonial-showcase::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px);
    background-size: 42px 42px;
    opacity: 0.35;
    animation: emGridDrift 18s linear infinite;
    pointer-events: none;
}

.em-testimonial-showcase::after {
    content: "";
    position: absolute;
    inset: auto -12% -38% 42%;
    height: 360px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.16), transparent 68%);
    filter: blur(4px);
    animation: emOrbFloat 8s ease-in-out infinite;
    pointer-events: none;
}

.em-testimonial-showcase .container {
    position: relative;
    z-index: 1;
}

.em-testimonial-intro {
    max-width: 720px;
}

.em-testimonial-showcase .em-section-kicker,
.em-testimonial-showcase .em-section-title,
.em-testimonial-showcase .em-section-copy {
    color: #fff;
}

.em-testimonial-showcase .em-section-copy {
    opacity: 0.88;
}

.em-testimonial-card {
    position: relative;
    overflow: hidden;
    padding: 24px;
    height: 100%;
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 24px 60px rgba(94, 4, 35, 0.22);
    transform: translateY(0);
}

.em-testimonial-card::before {
    content: "\201C";
    position: absolute;
    top: -14px;
    right: 18px;
    color: rgba(239, 23, 79, 0.08);
    font-size: 96px;
    line-height: 1;
    font-weight: 900;
}

.em-testimonial-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, 0.72) 45%, transparent 62%);
    transform: translateX(-125%);
    transition: transform 0.72s ease;
    pointer-events: none;
}

.em-testimonial-card:hover::after {
    transform: translateX(125%);
}

.em-testimonial-showcase.is-visible .em-testimonial-card {
    animation: emTestimonialFloat 5.2s ease-in-out infinite;
}

.em-testimonial-showcase.is-visible .row > [class*="col-"]:nth-child(2) .em-testimonial-card {
    animation-delay: 0.28s;
}

.em-testimonial-showcase.is-visible .row > [class*="col-"]:nth-child(3) .em-testimonial-card {
    animation-delay: 0.56s;
}

.em-testimonial-card:hover {
    animation: none !important;
    transform: translateY(-8px);
    border-color: rgba(255, 255, 255, 0.5);
    box-shadow: 0 30px 72px rgba(68, 3, 28, 0.34);
}

.em-testimonial-glow {
    position: absolute;
    right: -54px;
    bottom: -54px;
    width: 132px;
    height: 132px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(239, 23, 79, 0.22), transparent 68%);
    pointer-events: none;
}

.em-testimonial-stars {
    color: #ffc83d;
    letter-spacing: 2px;
    margin-bottom: 13px;
    animation: emStarTwinkle 2.4s ease-in-out infinite;
}

.em-testimonial-card p {
    position: relative;
    z-index: 1;
    color: var(--em-ink);
    font-size: 14px;
    line-height: 1.7;
}

.em-client {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 18px;
    position: relative;
    z-index: 1;
}

.em-client-avatar {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid #fff;
    object-fit: cover;
    box-shadow: 0 12px 28px rgba(239, 23, 79, 0.2);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.em-testimonial-card:hover .em-client-avatar {
    transform: scale(1.08);
    box-shadow: 0 16px 34px rgba(239, 23, 79, 0.28);
}

.em-client strong {
    display: block;
    color: var(--em-ink);
    font-size: 13px;
}

.em-client span {
    color: var(--em-muted);
    font-size: 12px;
}

.em-blog-card {
    overflow: hidden;
    height: 100%;
    position: relative;
}

.em-blog-image {
    height: 190px;
}

.em-blog-body {
    padding: 22px;
}

.em-blog-meta {
    color: #8a94aa;
    display: block;
    font-size: 12px;
    margin-bottom: 10px;
}

.em-cta-band {
    position: relative;
    overflow: hidden;
    color: #fff;
    background: var(--em-navy);
    border-radius: 8px;
    padding: 34px 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    box-shadow: 0 22px 54px rgba(7, 17, 38, 0.24);
}

.em-cta-band::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 18% 20%, rgba(239, 23, 79, 0.3), transparent 24%),
        radial-gradient(circle at 84% 50%, rgba(74, 163, 255, 0.22), transparent 30%);
    opacity: 0.72;
    animation: emCtaGlow 7s ease-in-out infinite alternate;
    pointer-events: none;
}

.em-cta-band > * {
    position: relative;
    z-index: 1;
}

.em-cta-band h2 {
    color: #fff;
    font-size: 31px;
    font-weight: 900;
    margin-bottom: 8px;
}

.em-cta-band p {
    color: #d3dbe8;
    margin: 0;
}

.em-site-footer {
    color: #c7d1e4;
    background: #081326;
    padding: 30px 0 18px;
    position: relative;
    overflow: visible;
}

.em-site-footer::before {
    content: none;
}

.em-site-footer .container {
    position: relative;
    z-index: 1;
}

.em-footer-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff !important;
    font-size: 22px;
    font-weight: 900;
    text-decoration: none !important;
    margin-bottom: 12px;
}

.em-footer-brand img {
    width: 30px;
    height: 30px;
}

.em-site-footer p {
    color: #aeb9cf;
    font-size: 13px;
    line-height: 1.55;
    margin-bottom: 0;
}

.em-footer-social {
    display: flex;
    gap: 9px;
    margin-top: 14px;
}

.em-footer-social a {
    width: 32px;
    height: 32px;
    color: #fff !important;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    text-decoration: none !important;
}

.em-footer-social a:hover {
    background: rgba(239, 23, 79, 0.78);
}

.em-footer-title {
    color: #fff;
    font-size: 15px;
    font-weight: 900;
    margin-bottom: 12px;
}

.em-footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.em-footer-links li {
    margin-bottom: 7px;
}

.em-footer-links a {
    color: #bcc8df !important;
    font-size: 13px;
    text-decoration: none !important;
}

.em-footer-links a:hover {
    color: #fff !important;
}

.em-footer-contact li {
    display: flex;
    gap: 10px;
    color: #aeb9cf;
    font-size: 13px;
    line-height: 1.45;
}

.em-footer-contact i {
    color: var(--em-pink);
    margin-top: 3px;
}

.em-site-footer .em-btn {
    min-height: 38px;
    padding: 10px 16px;
    font-size: 12px;
}

.em-newsletter {
    display: flex;
    gap: 8px;
    margin-top: 14px;
}

.em-newsletter input {
    min-width: 0;
    flex: 1;
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 5px;
    padding: 11px 12px;
}

.em-newsletter input::placeholder {
    color: #8490a9;
}

.em-newsletter button {
    border: 0;
    min-width: 42px;
    border-radius: 5px;
    color: #fff;
    background: var(--em-pink);
}

.em-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    margin-top: 18px;
    padding: 14px 0 0;
    color: #9fabca;
    font-size: 12px;
}

.em-footer-bottom a {
    color: #aeb9cf !important;
    margin-left: 20px;
    text-decoration: none !important;
}

.em-whatsapp {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 70;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    color: #fff !important;
    background: #18c56e;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 23px;
    box-shadow: 0 14px 28px rgba(24, 197, 110, 0.35);
    text-decoration: none !important;
}

#menu .modal-content.full {
    background: var(--em-navy) !important;
    min-height: 100dvh;
    height: auto;
    overflow: visible;
}

#menu .modal-dialog {
    width: 100%;
    max-width: 100%;
    margin: 0;
    min-height: 100dvh;
    height: auto !important;
}

#menu {
    overflow-x: hidden;
    overflow-y: auto;
}

#menu .modal-header {
    min-height: 74px;
    padding: 14px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

#menu .modal-header img {
    width: 118px !important;
    max-height: 42px;
    object-fit: contain;
}

#menu .modal-header .icon-close {
    margin-left: auto;
    font-size: 24px;
}

#menu .modal-body {
    align-items: flex-start;
    display: block;
    min-height: calc(100dvh - 74px);
    height: auto;
    overflow: visible;
    padding: 20px 22px 36px;
}

#menu .menu,
#menu .row,
#menu .items,
#menu .items > .navbar-nav {
    width: 100% !important;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    overflow: visible;
}

#menu .menu > .row,
#menu .modal-body > .row {
    margin-left: 0;
    margin-right: 0;
}

#menu .items,
#menu .contacts {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#menu .navbar-nav.items {
    display: block;
    width: 100%;
    margin: 0;
}

#menu .navbar-nav.items .nav-link {
    color: #fff !important;
    text-align: left;
}

#menu .dropdown-menu.show {
    position: static !important;
    float: none;
    width: 100%;
    max-width: 100%;
    padding: 8px 0 14px;
    margin: 0;
    transform: none !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible;
}

#menu .dropdown-menu {
    position: static !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible;
}

#menu .em-mega-menu {
    left: auto !important;
    top: auto !important;
    width: 100%;
    max-width: 100%;
    padding: 8px 0 0;
    transform: none !important;
}

#menu .em-mega-panel {
    min-height: 0;
    padding: 14px;
    border-radius: 10px;
    background: #09142b;
    box-shadow: none;
    overflow: visible;
}

#menu .em-mega-panel .row {
    margin-left: 0;
    margin-right: 0;
}

#menu .em-mega-panel [class*="col-"] {
    padding-left: 0;
    padding-right: 0;
    max-width: 100%;
    flex: 0 0 100%;
}

#menu .em-mega-kicker,
#menu .em-mega-title,
#menu .em-mega-copy {
    display: none;
}

#menu .em-mega-panel .em-btn {
    width: 100%;
    min-height: 46px;
    justify-content: center;
    margin-bottom: 12px;
    font-size: 14px;
}

#menu .em-mega-list {
    grid-template-columns: 1fr;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

#menu .em-mega-list li {
    width: 100%;
    min-width: 0;
    overflow: visible;
}

#menu .em-mega-service {
    align-items: center;
    box-sizing: border-box;
    gap: 10px;
    width: 100%;
    max-width: 100%;
    min-height: 58px;
    margin: 0 !important;
    padding: 10px 12px !important;
    border-radius: 8px;
    background: #121b34;
    transform: none !important;
    overflow: visible;
}

#menu .em-mega-service:hover {
    background: #17223e;
    border-color: rgba(255, 255, 255, 0.1);
}

#menu .em-mega-icon {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
}

#menu .em-mega-service strong,
#menu .em-mega-service span:not(.em-mega-icon) {
    min-width: 0;
    max-width: 100%;
    text-align: left;
    white-space: normal;
}

#menu .em-mega-service strong {
    font-size: 14px;
    overflow: visible;
    text-overflow: clip;
}

#menu .em-mega-service span:not(.em-mega-icon) {
    font-size: 12px;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: clip;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

#menu .navbar-nav.items > .nav-item {
    margin: 0 0 8px;
}

#menu .navbar-nav.items > .nav-item > .nav-link {
    align-items: center;
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 9px;
    display: flex;
    font-size: 18px;
    font-weight: 800;
    justify-content: space-between;
    margin: 0;
    min-height: 50px;
    padding: 13px 15px;
    width: 100%;
}

#menu .navbar-nav.items > .nav-item.active > .nav-link,
#menu .navbar-nav.items > .nav-item > .nav-link:hover {
    background: rgba(239, 23, 79, 0.14);
    border-color: rgba(239, 23, 79, 0.38);
    color: #fff !important;
}

@media (min-width: 992px) {
    .em-site-header .nav-item.dropdown:hover > .dropdown-menu {
        display: block;
    }
}

@media (max-width: 1199px) {
    .em-site-header .navbar-nav.icons,
    .em-header-action {
        display: none;
    }
}

@media (max-width: 991px) {
    body {
        padding-top: 74px;
    }

    .em-site-header .navbar .container.header {
        max-width: 100%;
        padding-left: 22px;
        padding-right: 22px;
    }

    .em-site-header .navbar-nav.items {
        display: none;
    }

    .em-site-header .navbar {
        min-height: 74px;
    }

    .em-toggle {
        display: flex !important;
        margin-left: auto;
    }

    .em-hero {
        padding-top: 58px;
    }

    .em-dashboard {
        margin-top: 30px;
    }

    .em-solution-lab {
        margin-top: 30px;
    }

    .em-code-chip-one {
        left: 6px;
    }

    .em-code-chip-three {
        right: 6px;
    }

    .em-feature-strip,
    .em-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .em-process-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .em-process-row::before {
        display: none;
    }

    .em-process-card::after {
        display: none;
    }

    .em-section-head,
    .em-cta-band {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 767px) {
    .em-hero-title {
        font-size: 40px;
    }

    .em-section {
        padding: 54px 0;
    }

    .em-section-head {
        margin-bottom: 20px;
    }

    .em-code-cloud {
        display: none;
    }

    .em-solution-lab {
        min-height: auto;
        padding: 18px;
    }

    .em-lab-top {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .em-solution-canvas {
        display: grid;
        gap: 12px;
        min-height: auto;
    }

    .em-flow-lines,
    .em-delivery-node {
        display: none;
    }

    .em-web-preview,
    .em-mobile-preview,
    .em-chatbot-preview,
    .em-automation-preview {
        position: relative;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        width: 100%;
        min-height: auto;
        transform: none;
    }

    .em-mobile-preview {
        border-radius: 16px;
    }

    .em-logo-item {
        width: 160px;
        min-height: 64px;
    }

    .em-logo-item img {
        max-width: 112px;
        max-height: 38px;
    }

    .em-stat-item {
        justify-content: flex-start;
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.12);
        padding: 14px 0;
    }

    .em-stat-item:last-child {
        border-bottom: 0;
    }

    .em-process-row {
        grid-template-columns: 1fr;
    }

    .em-mission-panel {
        padding: 30px 24px;
    }

    .em-cta-band {
        padding: 28px 22px;
    }

    .em-footer-bottom .d-flex {
        gap: 12px;
        align-items: flex-start !important;
        flex-direction: column;
    }

    .em-footer-bottom a {
        margin-left: 0;
        margin-right: 16px;
    }
}

.em-inner-hero {
    position: relative;
    overflow: hidden;
    color: #fff;
    background:
        radial-gradient(circle at 78% 18%, rgba(74, 163, 255, 0.24), transparent 28%),
        radial-gradient(circle at 20% 20%, rgba(239, 23, 79, 0.18), transparent 24%),
        linear-gradient(135deg, #071126 0%, #0b1730 100%);
    padding: 84px 0 76px;
}

.em-inner-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
    background-size: 44px 44px;
    opacity: 0.65;
}

.em-inner-hero .container {
    position: relative;
    z-index: 1;
}

.em-breadcrumb {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #c4cee2;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 18px;
}

.em-breadcrumb a {
    color: #fff !important;
    text-decoration: none !important;
}

.em-inner-title {
    color: #fff;
    font-size: clamp(38px, 5vw, 62px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: 0;
    margin-bottom: 16px;
}

.em-inner-copy {
    color: #cbd5e8;
    font-size: 16px;
    line-height: 1.8;
    max-width: 720px;
    margin: 0;
}

.em-hero-metric-row {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 28px;
}

.em-hero-metric {
    min-width: 132px;
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    padding: 14px 16px;
}

.em-hero-metric strong {
    display: block;
    font-size: 24px;
    line-height: 1;
}

.em-hero-metric span {
    display: block;
    color: #b8c3d8;
    font-size: 12px;
    margin-top: 7px;
}

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

.em-page-card {
    background: #fff;
    border: 1px solid var(--em-border);
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
    overflow: hidden;
}

.em-page-card-body {
    padding: 24px;
}

.em-page-card h3 {
    color: var(--em-ink);
    font-size: 19px;
    font-weight: 900;
    line-height: 1.3;
    margin-bottom: 10px;
}

.em-page-card p {
    color: var(--em-muted);
    font-size: 14px;
    line-height: 1.7;
}

.em-side-panel {
    background: #fff;
    border: 1px solid var(--em-border);
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
    padding: 26px;
}

.em-about-sticky-panel {
    position: sticky;
    top: 112px;
    z-index: 2;
}

.em-service-sticky-sidebar,
.em-detail-sticky-sidebar {
    position: sticky;
    top: 112px;
    z-index: 2;
}

.em-side-panel + .em-side-panel {
    margin-top: 20px;
}

.em-side-title {
    color: var(--em-ink);
    font-size: 18px;
    font-weight: 900;
    margin-bottom: 16px;
}

.em-side-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.em-side-list li {
    border-bottom: 1px solid var(--em-border);
}

.em-side-list li:last-child {
    border-bottom: 0;
}

.em-side-list > li > a,
.em-side-list > li > span {
    color: var(--em-ink) !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 0;
    text-decoration: none !important;
    font-size: 14px;
    font-weight: 700;
}

.em-side-list strong {
    color: var(--em-muted);
    font-size: 13px;
    font-weight: 700;
    text-align: right;
}

.em-side-list i {
    color: var(--em-pink);
}

.em-rich-content {
    color: var(--em-muted);
    font-size: 15px;
    line-height: 1.85;
}

.em-rich-content h1,
.em-rich-content h2,
.em-rich-content h3,
.em-rich-content h4 {
    color: var(--em-ink);
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.18;
    margin: 28px 0 12px;
}

.em-rich-content h1 {
    font-size: 34px !important;
    max-width: 680px;
}

.em-rich-content h2 {
    font-size: 28px !important;
    max-width: 680px;
}

.em-rich-content h3 {
    font-size: 22px !important;
}

.em-rich-content h4 {
    font-size: 18px !important;
}

.em-rich-content p {
    margin-bottom: 16px;
}

.em-rich-content ul,
.em-rich-content ol {
    margin: 0 0 18px 22px;
}

.em-rich-content img {
    max-width: 100%;
    height: auto;
}

.em-detail-image {
    width: 100%;
    min-height: 320px;
    max-height: 520px;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: var(--em-shadow);
}

.em-detail-shell {
    background: #fff;
    border: 1px solid var(--em-border);
    border-radius: 8px;
    padding: 34px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

.em-detail-shell > .em-section-title {
    font-size: 32px;
    line-height: 1.18;
    margin-bottom: 22px;
}

.em-contact-card {
    height: 100%;
    background: #fff;
    border: 1px solid var(--em-border);
    border-radius: 8px;
    padding: 28px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

.em-contact-card i {
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: var(--em-pink);
    border-radius: 12px;
    font-size: 22px;
    margin-bottom: 18px;
}

.em-contact-card h3 {
    color: var(--em-ink);
    font-size: 18px;
    font-weight: 900;
}

.em-contact-card a,
.em-contact-card p {
    color: var(--em-muted);
    font-size: 14px;
    line-height: 1.65;
}

.em-form-shell {
    background: #fff;
    border: 1px solid var(--em-border);
    border-radius: 8px;
    padding: 34px;
    box-shadow: var(--em-shadow);
}

.em-form-shell .form-control {
    height: auto;
    min-height: 52px;
    border: 1px solid var(--em-border);
    border-radius: 6px;
    padding: 14px 16px;
    color: var(--em-ink);
    background: #fff;
    font-size: 14px;
}

.em-form-shell textarea.form-control {
    min-height: 150px;
}

.em-form-shell .form-control:focus {
    border-color: rgba(239, 23, 79, 0.5);
    box-shadow: 0 0 0 3px rgba(239, 23, 79, 0.08);
}

.em-form-shell .form-alert {
    display: none;
    color: var(--em-pink);
    font-size: 13px;
    font-weight: 700;
}

.em-form-shell .form-alert.green-text {
    color: #17a66a;
}

.em-team-card {
    position: relative;
    height: 100%;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(135deg, rgba(239, 23, 79, 0.34), rgba(74, 163, 255, 0.26)) border-box;
    border: 1px solid transparent;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.em-team-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 28px 64px rgba(15, 23, 42, 0.14);
}

.em-team-media {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #eef3fb, #fff);
}

.em-team-media::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 44%;
    background: linear-gradient(to top, rgba(7, 17, 38, 0.52), transparent);
    pointer-events: none;
}

.em-team-media img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
    transition: transform 0.35s ease;
}

.em-team-card:hover .em-team-media img {
    transform: scale(1.04);
}

.em-team-badge {
    position: absolute;
    left: 18px;
    bottom: 16px;
    z-index: 1;
    color: #fff;
    background: var(--em-pink);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    padding: 7px 12px;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
    box-shadow: 0 12px 26px rgba(239, 23, 79, 0.28);
}

.em-team-body {
    position: relative;
    padding: 24px 24px 26px;
}

.em-team-body::before {
    content: "";
    position: absolute;
    top: 0;
    left: 24px;
    right: 24px;
    height: 3px;
    background: linear-gradient(90deg, var(--em-pink), var(--em-blue));
    border-radius: 999px;
}

.em-team-body h3 {
    color: var(--em-ink);
    font-size: 20px;
    font-weight: 900;
    margin: 14px 0 5px;
}

.em-team-body p {
    color: var(--em-muted);
    font-size: 13px;
    margin-bottom: 16px;
}

.em-team-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 30px;
    margin-bottom: 18px;
}

.em-team-meta span {
    color: #49546a;
    background: #f4f7fb;
    border: 1px solid #e5ebf4;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 800;
}

.em-team-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--em-pink) !important;
    background: rgba(239, 23, 79, 0.08);
    border: 1px solid rgba(239, 23, 79, 0.16);
    border-radius: 6px;
    padding: 9px 12px;
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none !important;
    transition: color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.em-team-link:hover {
    color: #fff !important;
    background: var(--em-pink);
    transform: translateY(-2px);
}

.em-work-feature {
    overflow: hidden;
    border-radius: 10px;
    background: #fff;
    border: 1px solid var(--em-border);
    box-shadow: var(--em-shadow);
}

.em-work-feature + .em-work-feature {
    margin-top: 30px;
}

.em-work-media {
    min-height: 340px;
    background: linear-gradient(135deg, #eaf2ff, #f8eaf0);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px;
}

.em-work-media img {
    max-width: 100%;
    max-height: 320px;
    object-fit: contain;
}

.em-work-copy {
    padding: 42px;
}

.em-work-copy h3 {
    color: var(--em-ink);
    font-size: 30px;
    line-height: 1.2;
    font-weight: 900;
    margin-bottom: 14px;
}

.em-work-copy p {
    color: var(--em-muted);
    line-height: 1.8;
}

.em-empty-state {
    text-align: center;
    background: #fff;
    border: 1px dashed #cdd6e5;
    border-radius: 8px;
    padding: 46px 24px;
}

.em-empty-state h3 {
    color: var(--em-ink);
    font-weight: 900;
}

.em-empty-state p {
    color: var(--em-muted);
    margin-bottom: 0;
}

.em-animated-section .em-section-head,
.em-animated-section > .container > .em-section-kicker,
.em-animated-section > .container > .em-section-title,
.em-animated-section > .container > .em-section-copy,
.em-animated-section .em-testimonial-intro,
.em-animated-section .em-reveal-card {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.58s ease, transform 0.58s ease;
}

.em-animated-section.is-visible .em-section-head,
.em-animated-section.is-visible > .container > .em-section-kicker,
.em-animated-section.is-visible > .container > .em-section-title,
.em-animated-section.is-visible > .container > .em-section-copy,
.em-animated-section.is-visible .em-testimonial-intro,
.em-animated-section.is-visible .em-reveal-card {
    opacity: 1;
    transform: translateY(0);
}

.em-animated-section.is-visible .em-reveal-card {
    transition-delay: 0.12s;
}

.em-animated-section.is-visible .row > [class*="col-"]:nth-child(2) .em-reveal-card {
    transition-delay: 0.22s;
}

.em-animated-section.is-visible .row > [class*="col-"]:nth-child(3) .em-reveal-card {
    transition-delay: 0.32s;
}

.em-animated-section.is-visible .row > [class*="col-"]:nth-child(4) .em-reveal-card {
    transition-delay: 0.42s;
}

.em-animated-section.is-visible .row > [class*="col-"]:nth-child(5) .em-reveal-card {
    transition-delay: 0.52s;
}

.em-animated-section.is-visible .row > [class*="col-"]:nth-child(6) .em-reveal-card {
    transition-delay: 0.62s;
}

.em-animated-section.is-visible .em-cta-band.em-reveal-card {
    transition-delay: 0.18s;
}

.em-logo-showcase.is-visible .em-logo-item:nth-child(2) {
    transition-delay: 0.14s;
}

.em-logo-showcase.is-visible .em-logo-item:nth-child(3) {
    transition-delay: 0.2s;
}

.em-logo-showcase.is-visible .em-logo-item:nth-child(4) {
    transition-delay: 0.26s;
}

.em-logo-showcase.is-visible .em-logo-item:nth-child(5) {
    transition-delay: 0.32s;
}

.em-logo-showcase.is-visible .em-logo-item:nth-child(6) {
    transition-delay: 0.38s;
}

.em-logo-showcase.is-visible .em-logo-item:nth-child(7) {
    transition-delay: 0.44s;
}

.em-logo-showcase.is-visible .em-logo-item:nth-child(8) {
    transition-delay: 0.5s;
}

.em-portfolio-showcase,
.em-blog-showcase {
    background:
        linear-gradient(180deg, #fff 0%, #fff 72%, #f7f9fd 100%);
}

@keyframes emHeroGradient {
    from {
        background-position: 0% 50%;
    }
    to {
        background-position: 100% 50%;
    }
}

@keyframes emStarTwinkle {
    0%, 100% {
        filter: drop-shadow(0 0 0 rgba(255, 200, 61, 0));
        opacity: 0.85;
    }
    50% {
        filter: drop-shadow(0 0 7px rgba(255, 200, 61, 0.34));
        opacity: 1;
    }
}

@keyframes emButtonRipple {
    0% {
        opacity: 0.55;
        transform: translate(-50%, -50%) scale(0);
    }
    100% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(18);
    }
}

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

@keyframes emCtaGlow {
    from {
        opacity: 0.55;
        transform: translateX(-2%);
    }
    to {
        opacity: 0.95;
        transform: translateX(2%);
    }
}

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

@keyframes emCodeChipFloat {
    0%, 100% {
        transform: translate3d(0, 0, 0);
        opacity: 0.72;
    }
    50% {
        transform: translate3d(10px, -12px, 0);
        opacity: 1;
    }
}

@keyframes emDashboardScan {
    0%, 22% {
        transform: translateX(-120%);
        opacity: 0;
    }
    45% {
        opacity: 1;
    }
    78%, 100% {
        transform: translateX(120%);
        opacity: 0;
    }
}

@keyframes emLiveBadgePulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(74, 163, 255, 0);
    }
    50% {
        box-shadow: 0 0 0 5px rgba(74, 163, 255, 0.12);
    }
}

@keyframes emLogoMarquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-50% - 9px));
    }
}

@keyframes emFlowDash {
    to {
        stroke-dashoffset: -38;
    }
}

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

@keyframes emMobileFloat {
    0%, 100% {
        transform: translateY(0) rotate(0deg);
    }
    50% {
        transform: translateY(-9px) rotate(1.5deg);
    }
}

@keyframes emPreviewScan {
    0%, 28% {
        transform: translateX(-100%);
        opacity: 0;
    }
    46% {
        opacity: 1;
    }
    72%, 100% {
        transform: translateX(100%);
        opacity: 0;
    }
}

@keyframes emMobileBar {
    0%, 100% {
        opacity: 0.55;
        transform: scaleX(0.9);
    }
    50% {
        opacity: 1;
        transform: scaleX(1);
    }
}

@keyframes emTypingDot {
    0%, 100% {
        opacity: 0.35;
        transform: translateY(0);
    }
    45% {
        opacity: 1;
        transform: translateY(-4px);
    }
}

@keyframes emAutomationPulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(74, 163, 255, 0);
        transform: scale(1);
    }
    50% {
        box-shadow: 0 0 0 7px rgba(74, 163, 255, 0.08);
        transform: scale(1.06);
    }
}

@keyframes emAutomationArrow {
    0%, 100% {
        transform: translateX(-4px);
        opacity: 0.55;
    }
    50% {
        transform: translateX(4px);
        opacity: 1;
    }
}

@keyframes emLaunchPulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 18px 38px rgba(239, 23, 79, 0.28);
    }
    50% {
        transform: scale(1.07);
        box-shadow: 0 22px 48px rgba(125, 112, 255, 0.36);
    }
}

@keyframes emCodeGridMove {
    from {
        background-position: 0 0, 0 0;
    }
    to {
        background-position: 48px 48px, 48px 48px;
    }
}

@keyframes emCodeFloat {
    0%, 100% {
        transform: translateY(0) rotate(0deg);
    }
    50% {
        transform: translateY(18px) rotate(-3deg);
    }
}

@keyframes emServiceScan {
    0%, 18% {
        opacity: 0;
        transform: translateY(0) rotate(10deg);
    }
    36% {
        opacity: 1;
    }
    68%, 100% {
        opacity: 0;
        transform: translateY(290%) rotate(10deg);
    }
}

@keyframes emIconPulse {
    0%, 100% {
        transform: translateY(0);
        box-shadow: 0 12px 28px rgba(74, 163, 255, 0.12);
    }
    50% {
        transform: translateY(-4px);
        box-shadow: 0 18px 38px rgba(74, 163, 255, 0.22);
    }
}

@keyframes emNodeRing {
    0%, 100% {
        opacity: 0;
        transform: scale(0.86);
    }
    45% {
        opacity: 1;
        transform: scale(1.05);
    }
}

@keyframes emStatsSweep {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(100%);
    }
}

@keyframes emStatIconPulse {
    0%, 100% {
        color: #80a6ff;
        transform: scale(1);
    }
    50% {
        color: #ff6f97;
        transform: scale(1.12);
    }
}

@keyframes emGridDrift {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 46px 46px;
    }
}

@keyframes emOrbFloat {
    0%, 100% {
        transform: translate3d(0, 0, 0) scale(1);
        opacity: 0.7;
    }
    50% {
        transform: translate3d(-34px, 26px, 0) scale(1.08);
        opacity: 0.95;
    }
}

@keyframes emFadeUp {
    from {
        opacity: 0;
        transform: translateY(18px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes emTextShine {
    from {
        background-position: 0% 50%;
    }
    to {
        background-position: 100% 50%;
    }
}

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

@keyframes emDrawChart {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes emProcessArrow {
    0% {
        opacity: 0;
        transform: translateX(-14px) scaleX(0.7);
    }
    22% {
        opacity: 1;
    }
    55% {
        opacity: 1;
        transform: translateX(4px) scaleX(1);
    }
    100% {
        opacity: 0;
        transform: translateX(18px) scaleX(0.78);
    }
}

@keyframes emProcessPulse {
    0%, 100% {
        opacity: 0;
        transform: scale(0.92);
    }
    45% {
        opacity: 1;
        transform: scale(1.08);
    }
}

@media (prefers-reduced-motion: reduce) {
    .em-hero,
    .em-hero::before,
    .em-hero::after,
    .em-hero-title,
    .em-gradient-text,
    .em-hero-copy,
    .em-hero-actions,
    .em-trust-row,
    .em-avatar-stack img,
    .em-avatar-stack span,
    .em-code-chip,
    .em-logo-track,
    .em-solution-lab,
    .em-solution-lab::before,
    .em-solution-lab::after,
    .em-flow-lines path,
    .em-web-preview,
    .em-mobile-preview,
    .em-preview-hero::after,
    .em-mobile-screen span,
    .em-chatbot-preview,
    .em-chatbot-preview b,
    .em-automation-preview,
    .em-automation-preview span,
    .em-delivery-node,
    .em-dashboard,
    .em-dashboard::before,
    .em-dashboard-badge,
    .em-chart path:last-child,
    .em-feature-mini,
    .em-services-showcase::before,
    .em-services-showcase::after,
    .em-services-showcase.is-visible .em-service-dev-card::after,
    .em-service-dev-card .em-service-icon,
    .em-services-showcase.is-visible .em-service-dev-card .em-service-icon::before,
    .em-dev-stats::before,
    .em-services-showcase.is-visible .em-dev-stats .em-stat-icon,
    .em-testimonial-showcase::before,
    .em-testimonial-showcase::after,
    .em-testimonial-showcase.is-visible .em-testimonial-card,
    .em-testimonial-stars,
    .em-cta-band::before,
    .em-process-row.is-visible .em-process-card:not(:last-child)::after,
    .em-process-row.is-visible .em-process-icon::before {
        animation: none !important;
    }

    .em-animated-section .em-section-head,
    .em-animated-section > .container > .em-section-kicker,
    .em-animated-section > .container > .em-section-title,
    .em-animated-section > .container > .em-section-copy,
    .em-animated-section .em-testimonial-intro,
    .em-animated-section .em-reveal-card {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }

    .em-dev-stats .em-stat-item {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

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

    .em-about-sticky-panel {
        position: static;
    }

    .em-service-sticky-sidebar,
    .em-detail-sticky-sidebar {
        position: static;
    }

    .em-work-copy {
        padding: 30px;
    }
}

@media (max-width: 767px) {
    .em-inner-hero {
        padding: 60px 0 54px;
    }

    .em-page-grid {
        grid-template-columns: 1fr;
    }

    .em-detail-shell,
    .em-form-shell {
        padding: 24px;
    }

    .em-detail-shell > .em-section-title {
        font-size: 26px;
    }

    .em-rich-content h1 {
        font-size: 28px !important;
    }

    .em-rich-content h2 {
        font-size: 24px !important;
    }

    .em-rich-content h3 {
        font-size: 20px !important;
    }

    .em-work-media {
        min-height: 230px;
    }

    .em-work-copy h3 {
        font-size: 24px;
    }
}
