:root {
            --itzamna-dark: #071426;
            --itzamna-navy: #091e3e;
            --itzamna-blue: #06a3da;
            --itzamna-cyan: #39d5ff;
            --itzamna-gold: #f4b942;
            --itzamna-glass: rgba(255, 255, 255, 0.09);
            --itzamna-border: rgba(255, 255, 255, 0.14);
            --itzamna-soft: #eef7ff;
        }

        body {
            font-family: 'Nunito', sans-serif;
            background: #f5f8fc;
            color: #22314a;
        }

        .bg-header {
            margin-bottom: 0 !important;
            background: transparent !important;
            padding: 0 !important;
        }

        .ee-page {
            overflow: hidden;
            background:
                radial-gradient(circle at top left, rgba(6, 163, 218, 0.20), transparent 32rem),
                radial-gradient(circle at top right, rgba(244, 185, 66, 0.15), transparent 28rem),
                #f5f8fc;
        }

        .ee-hero {
            position: relative;
            min-height: 760px;
            display: flex;
            align-items: center;
            color: #fff;
            background:
                linear-gradient(135deg, rgba(7, 20, 38, 0.96), rgba(9, 30, 62, 0.94)),
                url('https://itzamna-tech-public-website.s3.amazonaws.com/gif/digital-twin.gif') center right / contain no-repeat;
            isolation: isolate;
        }

        .ee-hero::before {
            content: '';
            position: absolute;
            inset: 0;
            background:
                linear-gradient(90deg, rgba(7,20,38,1) 0%, rgba(7,20,38,0.95) 42%, rgba(7,20,38,0.62) 100%),
                radial-gradient(circle at 75% 30%, rgba(6, 163, 218, 0.32), transparent 22rem);
            z-index: -1;
        }

        .ee-hero::after {
            content: '';
            position: absolute;
            width: 680px;
            height: 680px;
            right: -260px;
            top: 60px;
            border: 1px solid rgba(57, 213, 255, 0.20);
            border-radius: 50%;
            box-shadow: 0 0 100px rgba(6, 163, 218, 0.18);
            z-index: -1;
        }

        .ee-badge {
            display: inline-flex;
            gap: 10px;
            align-items: center;
            padding: 10px 16px;
            border: 1px solid var(--itzamna-border);
            border-radius: 999px;
            background: var(--itzamna-glass);
            color: #dff8ff;
            backdrop-filter: blur(14px);
            font-weight: 800;
            letter-spacing: .2px;
            margin-bottom: 22px;
        }

        .ee-hero h1 {
            font-size: clamp(2.7rem, 6vw, 5.8rem);
            line-height: .95;
            font-weight: 900;
            letter-spacing: -2.5px;
            color: #fff;
            margin-bottom: 24px;
        }

        .ee-gradient-text {
            background: linear-gradient(90deg, #fff 0%, #39d5ff 45%, #f4b942 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .ee-hero p {
            color: rgba(255,255,255,.82);
            font-size: 1.18rem;
            max-width: 640px;
        }

        .ee-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin-top: 32px;
        }

        .ee-btn-primary,
        .ee-btn-outline {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            min-height: 54px;
            padding: 14px 22px;
            border-radius: 16px;
            font-weight: 900;
            text-decoration: none;
            transition: .25s ease;
        }

        .ee-btn-primary {
            color: #061326;
            background: linear-gradient(135deg, #39d5ff, #06a3da);
            box-shadow: 0 18px 40px rgba(6, 163, 218, .28);
        }

        .ee-btn-primary:hover {
            color: #061326;
            transform: translateY(-3px);
            box-shadow: 0 22px 55px rgba(6, 163, 218, .38);
        }

        .ee-btn-outline {
            color: #fff;
            border: 1px solid var(--itzamna-border);
            background: rgba(255,255,255,.07);
        }

        .ee-btn-outline:hover {
            color: #fff;
            border-color: rgba(57, 213, 255, .45);
            background: rgba(57, 213, 255, .12);
            transform: translateY(-3px);
        }

        .ee-hero-panel {
            position: relative;
            padding: 24px;
            border: 1px solid var(--itzamna-border);
            border-radius: 32px;
            background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.06));
            backdrop-filter: blur(18px);
            box-shadow: 0 30px 80px rgba(0,0,0,.28);
        }

        .ee-hero-card {
            border-radius: 26px;
            overflow: hidden;
            background: rgba(255,255,255,.08);
            border: 1px solid var(--itzamna-border);
        }

        .ee-hero-card img {
            width: 100%;
            min-height: 360px;
            object-fit: cover;
            display: block;
            opacity: .92;
        }

        .ee-floating-card {
            position: absolute;
            left: -12px;
            bottom: 18px;
            width: 260px;
            padding: 18px;
            border-radius: 22px;
            border: 1px solid rgba(255,255,255,.18);
            background: rgba(7,20,38,.82);
            backdrop-filter: blur(14px);
            box-shadow: 0 20px 60px rgba(0,0,0,.35);
        }

        .ee-floating-card h5,
        .ee-floating-card p {
            color: #fff;
            margin: 0;
        }

        .ee-floating-card p {
            color: rgba(255,255,255,.68);
            font-size: .92rem;
        }

        .ee-stats-strip {
            margin-top: -68px;
            position: relative;
            z-index: 3;
        }

        .ee-stat-card {
            height: 100%;
            padding: 28px;
            border-radius: 28px;
            background: #fff;
            border: 1px solid rgba(9, 30, 62, .08);
            box-shadow: 0 20px 55px rgba(9,30,62,.10);
        }

        .ee-stat-icon {
            width: 58px;
            height: 58px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 18px;
            color: #fff;
            background: linear-gradient(135deg, var(--itzamna-blue), var(--itzamna-navy));
            box-shadow: 0 14px 28px rgba(6,163,218,.22);
            margin-bottom: 18px;
        }

        .ee-stat-card h3 {
            font-weight: 900;
            color: var(--itzamna-navy);
            margin-bottom: 4px;
        }

        .ee-stat-card p {
            margin-bottom: 0;
            color: #687894;
            font-weight: 700;
        }

        .ee-section {
            padding: 95px 0;
        }

        .ee-section-title {
            max-width: 760px;
            margin: 0 auto 46px;
            text-align: center;
        }

        .ee-kicker {
            color: var(--itzamna-blue);
            font-weight: 900;
            letter-spacing: .12em;
            text-transform: uppercase;
            font-size: .82rem;
        }

        .ee-section-title h2 {
            font-size: clamp(2rem, 4vw, 3.4rem);
            font-weight: 900;
            color: var(--itzamna-navy);
            letter-spacing: -1.2px;
            margin: 12px 0 18px;
        }

        .ee-section-title p {
            color: #687894;
            font-size: 1.08rem;
        }

        .ee-feature-card {
            height: 100%;
            padding: 30px;
            border-radius: 28px;
            background: #fff;
            border: 1px solid rgba(9, 30, 62, .08);
            box-shadow: 0 18px 48px rgba(9,30,62,.08);
            transition: .25s ease;
        }

        .ee-feature-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 26px 65px rgba(9,30,62,.13);
        }

        .ee-feature-card i {
            width: 56px;
            height: 56px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 18px;
            background: var(--itzamna-soft);
            color: var(--itzamna-blue);
            font-size: 1.35rem;
            margin-bottom: 20px;
        }

        .ee-feature-card h4 {
            color: var(--itzamna-navy);
            font-weight: 900;
            margin-bottom: 10px;
        }

        .ee-feature-card p {
            color: #687894;
            margin-bottom: 0;
        }

        .ee-catalog {
            background:
                linear-gradient(180deg, #fff, #f5f8fc),
                radial-gradient(circle at top center, rgba(6,163,218,.12), transparent 32rem);
        }

        .ee-toolbar {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
            margin-bottom: 30px;
            padding: 18px;
            border-radius: 24px;
            background: #fff;
            border: 1px solid rgba(9, 30, 62, .08);
            box-shadow: 0 16px 40px rgba(9,30,62,.07);
        }

        .ee-search-box {
            flex: 1 1 320px;
            position: relative;
        }

        .ee-search-box i {
            position: absolute;
            left: 18px;
            top: 50%;
            transform: translateY(-50%);
            color: #8aa0bb;
        }

        .ee-search-box input {
            width: 100%;
            min-height: 52px;
            padding: 12px 18px 12px 48px;
            border: 1px solid rgba(9, 30, 62, .10);
            border-radius: 16px;
            outline: none;
            font-weight: 800;
            color: var(--itzamna-navy);
            background: #f8fbff;
        }

        .ee-search-box input:focus {
            border-color: rgba(6, 163, 218, .45);
            box-shadow: 0 0 0 4px rgba(6, 163, 218, .10);
        }

        .ee-chip-group {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
        }

        .ee-chip {
            border: 0;
            min-height: 42px;
            padding: 9px 14px;
            border-radius: 999px;
            background: #eef7ff;
            color: var(--itzamna-navy);
            font-weight: 900;
            transition: .2s ease;
        }

        .ee-chip.active,
        .ee-chip:hover {
            color: #fff;
            background: var(--itzamna-blue);
        }

        .ee-card {
            position: relative;
            height: 100%;
            min-height: 430px;
            overflow: hidden;
            border-radius: 30px;
            background: var(--itzamna-navy);
            border: 1px solid rgba(9,30,62,.08);
            box-shadow: 0 20px 55px rgba(9,30,62,.15);
            transition: .28s ease;
        }

        .ee-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 28px 80px rgba(9,30,62,.23);
        }

        .ee-card-img {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: .35s ease;
        }

        .ee-card:hover .ee-card-img {
            transform: scale(1.06);
        }

        .ee-card-overlay {
            position: absolute;
            inset: 0;
            background:
                linear-gradient(180deg, rgba(7,20,38,.10) 0%, rgba(7,20,38,.68) 50%, rgba(7,20,38,.96) 100%),
                radial-gradient(circle at top right, rgba(6,163,218,.25), transparent 18rem);
        }

        .ee-card-content {
            position: relative;
            z-index: 2;
            height: 100%;
            min-height: 430px;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            padding: 26px;
            color: #fff;
        }

        .ee-avatar-tag {
            position: absolute;
            top: 22px;
            left: 22px;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 8px 12px;
            border-radius: 999px;
            background: rgba(255,255,255,.13);
            border: 1px solid rgba(255,255,255,.20);
            backdrop-filter: blur(12px);
            color: #fff;
            font-weight: 900;
            font-size: .82rem;
        }

        .ee-card-content h3 {
            color: #fff;
            font-weight: 900;
            margin-bottom: 8px;
            letter-spacing: -.4px;
        }

        .ee-card-meta {
            color: rgba(255,255,255,.72);
            margin-bottom: 18px;
            font-weight: 700;
        }

        .ee-card-meta span {
            display: block;
        }

        .ee-card-footer {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            padding-top: 18px;
            border-top: 1px solid rgba(255,255,255,.14);
        }

        .ee-version {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            color: rgba(255,255,255,.78);
            font-size: .86rem;
            font-weight: 800;
        }

        .ee-profile-link {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 10px 14px;
            border-radius: 14px;
            color: #061326;
            background: #fff;
            font-weight: 900;
            text-decoration: none;
            transition: .2s ease;
        }

        .ee-profile-link:hover {
            color: #061326;
            background: #39d5ff;
            transform: translateX(3px);
        }

        .ee-empty-state {
            padding: 46px;
            text-align: center;
            border-radius: 30px;
            background: #fff;
            border: 1px solid rgba(9, 30, 62, .08);
        }

        .ee-cta {
            position: relative;
            color: #fff;
            background:
                radial-gradient(circle at 15% 20%, rgba(57, 213, 255, .26), transparent 24rem),
                linear-gradient(135deg, var(--itzamna-navy), #05101f);
            border-radius: 38px;
            padding: 58px;
            overflow: hidden;
        }

        .ee-cta::after {
            content: '';
            position: absolute;
            width: 360px;
            height: 360px;
            right: -130px;
            bottom: -130px;
            border-radius: 50%;
            border: 1px solid rgba(255,255,255,.14);
            box-shadow: 0 0 80px rgba(57,213,255,.14);
        }

        .ee-cta h2 {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.8px;
        }

        .ee-cta p {
            color: rgba(255,255,255,.74);
            max-width: 680px;
            margin-bottom: 0;
        }

        .breadcrumb {
            background: rgba(255,255,255,.12) !important;
            border: 1px solid rgba(255,255,255,.12);
            backdrop-filter: blur(12px);
        }

        .breadcrumb a,
        .breadcrumb .active {
            color: rgba(255,255,255,.82) !important;
            font-weight: 800;
        }

        @media (max-width: 991px) {
            .ee-hero {
                min-height: auto;
                padding: 110px 0 120px;
                background-size: cover;
            }

            .ee-hero-panel {
                margin-top: 40px;
            }

            .ee-floating-card {
                left: 18px;
                right: 18px;
                width: auto;
            }

            .ee-stats-strip {
                margin-top: -46px;
            }

            .ee-cta {
                padding: 34px;
            }
        }

        @media (max-width: 575px) {
            .ee-actions a {
                width: 100%;
            }

            .ee-hero h1 {
                letter-spacing: -1px;
            }

            .ee-toolbar {
                padding: 14px;
            }
        }