.atlas-desktop-hero {
    display: none;
}

.home-hero-legacy {
    display: block;
}

@media (min-width: 992px) {
    .home-hero-legacy {
        display: none !important;
    }

    .atlas-desktop-hero {
        position: relative;
        z-index: 99;
        display: block;
        isolation: isolate;
        overflow: hidden;
        width: 100%;
        height: 100vh;
        height: 100svh;
        min-height: 680px;
        color: #fff;
        background: #052d82;
    }

    .atlas-desktop-hero::before,
    .atlas-desktop-hero::after {
        position: absolute;
        z-index: 2;
        inset: 0;
        content: "";
        pointer-events: none;
    }

    .atlas-desktop-hero::before {
        opacity: .16;
        background-image:
            linear-gradient(rgba(255, 255, 255, .1) 1px, transparent 1px),
            linear-gradient(90deg, rgba(255, 255, 255, .1) 1px, transparent 1px);
        background-size: 84px 84px;
        -webkit-mask-image: radial-gradient(circle at center, #000, transparent 72%);
        mask-image: radial-gradient(circle at center, #000, transparent 72%);
    }

    .atlas-desktop-hero::after {
        background:
            linear-gradient(180deg, rgba(0, 24, 82, .18), transparent 22%, transparent 72%, rgba(0, 26, 83, .12)),
            radial-gradient(circle at 50% 47%, rgba(28, 115, 255, .11), transparent 43%);
    }

    .atlas-desktop-hero__stage {
        position: absolute;
        z-index: 0;
        top: 50%;
        left: 50%;
        width: max(100vw, 177.7778vh);
        aspect-ratio: 16 / 9;
        transform: translate(-50%, -50%);
    }

    .atlas-desktop-hero__background {
        position: absolute;
        z-index: 0;
        inset: 0;
        background-color: #052d82;
        background-image: url("../images/atlas-hero-background.webp");
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
    }

    .atlas-desktop-hero__background::after {
        position: absolute;
        inset: 0;
        content: "";
        background:
            radial-gradient(circle at 50% 48%, rgba(25, 113, 255, .18), transparent 33%),
            linear-gradient(90deg, rgba(0, 27, 91, .22), transparent 25%, transparent 75%, rgba(0, 27, 91, .22));
    }

    .atlas-desktop-hero__orbits {
        position: absolute;
        z-index: 1;
        top: 50%;
        left: 50%;
        width: 43.5%;
        aspect-ratio: 1;
        border-radius: 50%;
        transform: translate(-50%, -50%);
    }

    .atlas-desktop-hero__orbit,
    .atlas-desktop-hero__rotator {
        position: absolute;
        top: 50%;
        left: 50%;
        aspect-ratio: 1;
        border-radius: 50%;
        transform: translate(-50%, -50%);
    }

    .atlas-desktop-hero__orbit--outer {
        width: 100%;
        border: 1px dashed rgba(255, 255, 255, .32);
        box-shadow: 0 0 38px rgba(13, 97, 235, .2);
    }

    .atlas-desktop-hero__orbit--middle {
        width: 88%;
        border: 1px solid rgba(255, 255, 255, .22);
    }

    .atlas-desktop-hero__orbit--middle::before,
    .atlas-desktop-hero__orbit--middle::after {
        position: absolute;
        inset: 5%;
        content: "";
        border: 1px dashed rgba(104, 178, 255, .24);
        border-radius: 50%;
        transform: rotate(18deg);
    }

    .atlas-desktop-hero__orbit--middle::after {
        inset: -5%;
        border-style: dotted;
        opacity: .7;
        transform: rotate(-12deg);
    }

    .atlas-desktop-hero__orbit--inner {
        width: 76%;
        border: 1px solid rgba(255, 255, 255, .62);
        box-shadow:
            inset 0 0 28px rgba(49, 134, 255, .08),
            0 0 28px rgba(49, 134, 255, .08);
    }

    .atlas-desktop-hero__orbit--core {
        width: 71%;
        border: 1px solid rgba(137, 193, 255, .36);
        box-shadow: inset 0 0 70px rgba(6, 65, 169, .16);
    }

    .atlas-desktop-hero__rotator {
        animation: atlas-orbit-spin 18s linear infinite;
    }

    .atlas-desktop-hero__rotator i {
        position: absolute;
        top: -5px;
        left: 50%;
        display: block;
        width: 10px;
        height: 10px;
        border: 2px solid rgba(255, 255, 255, .62);
        border-radius: 50%;
        background: #fff;
        box-shadow:
            0 0 0 7px rgba(255, 255, 255, .06),
            0 0 20px rgba(113, 187, 255, .78);
        transform: translateX(-50%);
    }

    .atlas-desktop-hero__rotator--one {
        width: 100%;
    }

    .atlas-desktop-hero__rotator--two {
        width: 88%;
        animation-duration: 14s;
        animation-direction: reverse;
    }

    .atlas-desktop-hero__rotator--two i {
        background: #ffb63e;
        border-color: #ffd98e;
        box-shadow:
            0 0 0 7px rgba(255, 182, 62, .08),
            0 0 22px rgba(255, 182, 62, .82);
    }

    .atlas-desktop-hero__rotator--three {
        width: 76%;
        animation-duration: 22s;
    }

    .atlas-desktop-hero__rotator--three i {
        width: 7px;
        height: 7px;
        background: #78c8ff;
        border-color: #d8f1ff;
    }

    .atlas-desktop-hero__axis-dot {
        position: absolute;
        z-index: 3;
        display: block;
        width: 8px;
        height: 8px;
        border: 2px solid rgba(255, 255, 255, .82);
        border-radius: 50%;
        background: #fff;
        box-shadow: 0 0 13px rgba(255, 255, 255, .76);
    }

    .atlas-desktop-hero__axis-dot--top {
        top: -4px;
        left: 50%;
        transform: translateX(-50%);
    }

    .atlas-desktop-hero__axis-dot--right {
        top: 50%;
        right: -4px;
        transform: translateY(-50%);
    }

    .atlas-desktop-hero__axis-dot--bottom {
        bottom: -4px;
        left: 50%;
        transform: translateX(-50%);
    }

    .atlas-desktop-hero__axis-dot--left {
        top: 50%;
        left: -4px;
        transform: translateY(-50%);
    }

    .atlas-desktop-hero__center {
        position: absolute;
        z-index: 5;
        top: 50%;
        left: 50%;
        width: 23%;
        transform: translate(-50%, -50%);
    }

    .atlas-desktop-hero__brand {
        position: relative;
        display: grid;
        justify-items: center;
        width: 100%;
        padding: 20px;
        color: #fff;
        border-radius: 34px;
        text-align: center;
        transition: transform .3s ease, filter .3s ease;
    }

    .atlas-desktop-hero__brand::before {
        position: absolute;
        z-index: -1;
        top: 40%;
        left: 50%;
        width: 72%;
        aspect-ratio: 1;
        content: "";
        opacity: .46;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(35, 132, 255, .34), transparent 68%);
        filter: blur(22px);
        transform: translate(-50%, -50%);
        transition: opacity .3s ease, transform .3s ease;
    }

    .atlas-desktop-hero__brand img {
        display: block;
        width: clamp(100px, 7.6vw, 146px);
        height: auto;
        margin-bottom: 30px;
        filter: drop-shadow(0 0 18px rgba(255, 255, 255, .14));
    }

    .atlas-desktop-hero__brand-line {
        position: relative;
        display: block;
        width: 82%;
        height: 1px;
        margin-bottom: 18px;
        background: linear-gradient(90deg, transparent, #ffb63e 18%, #ffb63e 82%, transparent);
    }

    .atlas-desktop-hero__brand-line i {
        position: absolute;
        top: 50%;
        left: 50%;
        display: block;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: #ffca70;
        box-shadow: 0 0 14px rgba(255, 182, 62, .82);
        transform: translate(-50%, -50%);
    }

    .atlas-desktop-hero__brand h1 {
        margin: 0;
        color: #fff;
        font-family: IRANSansfanum, IRANSans, sans-serif;
        font-size: clamp(15px, 1.15vw, 22px);
        font-weight: 500;
        line-height: 1.9;
        white-space: nowrap;
        text-shadow: 0 3px 18px rgba(0, 24, 77, .46);
    }

    .atlas-desktop-hero__brand:hover,
    .atlas-desktop-hero__brand:focus-visible {
        color: #fff;
        filter: drop-shadow(0 0 18px rgba(80, 160, 255, .2));
        transform: translateY(-3px);
    }

    .atlas-desktop-hero__brand:hover::before,
    .atlas-desktop-hero__brand:focus-visible::before {
        opacity: .75;
        transform: translate(-50%, -50%) scale(1.12);
    }

    .atlas-desktop-hero__services {
        position: absolute;
        z-index: 6;
        inset: 0;
        pointer-events: none;
    }

    .atlas-desktop-hero__service {
        position: absolute;
        isolation: isolate;
        display: flex;
        direction: ltr;
        width: 27%;
        min-height: 116px;
        align-items: center;
        gap: 18px;
        padding: 10px 16px;
        color: #fff;
        border: 1px solid transparent;
        border-radius: 28px;
        pointer-events: auto;
        transition:
            color .38s ease,
            border-color .38s ease,
            background .38s ease,
            box-shadow .38s ease,
            transform .45s cubic-bezier(.2, .8, .2, 1);
    }

    .atlas-desktop-hero__service::before,
    .atlas-desktop-hero__service::after {
        position: absolute;
        z-index: 0;
        inset: 0;
        content: "";
        border-radius: inherit;
        pointer-events: none;
    }

    .atlas-desktop-hero__service::before {
        background:
            radial-gradient(circle at 50% 50%, rgba(42, 139, 255, .18), transparent 62%),
            linear-gradient(135deg, rgba(255, 255, 255, .07), transparent 55%);
        opacity: 0;
        transform: scale(.96);
        transition: opacity .38s ease, transform .45s cubic-bezier(.2, .8, .2, 1);
    }

    .atlas-desktop-hero__service::after {
        clip-path: inset(0 round 28px);
        background: linear-gradient(110deg, transparent 28%, rgba(255, 255, 255, .22) 48%, transparent 68%);
        opacity: 0;
        transform: translateX(-125%);
    }

    .atlas-desktop-hero__service:hover,
    .atlas-desktop-hero__service:focus-visible {
        color: #fff;
        border-color: rgba(255, 255, 255, .34);
        background: linear-gradient(135deg, rgba(255, 255, 255, .105), rgba(255, 255, 255, .025));
        box-shadow:
            inset 0 0 38px rgba(44, 132, 255, .11),
            0 20px 48px rgba(0, 18, 67, .2),
            0 0 34px rgba(38, 129, 255, .08);
        transform: translateY(-5px) scale(1.012);
    }

    .atlas-desktop-hero__service--left:hover,
    .atlas-desktop-hero__service--left:focus-visible {
        transform: translateX(9px) translateY(-5px) scale(1.012);
    }

    .atlas-desktop-hero__service--right:hover,
    .atlas-desktop-hero__service--right:focus-visible {
        transform: translateX(-9px) translateY(-5px) scale(1.012);
    }

    .atlas-desktop-hero__service:hover::before,
    .atlas-desktop-hero__service:focus-visible::before {
        opacity: 1;
        transform: scale(1);
    }

    .atlas-desktop-hero__service:hover::after,
    .atlas-desktop-hero__service:focus-visible::after {
        animation: atlas-service-sheen .9s cubic-bezier(.2, .7, .2, 1) both;
    }

    .atlas-desktop-hero__service-copy {
        position: relative;
        z-index: 2;
        display: grid;
        min-width: 0;
        flex: 1 1 auto;
        gap: 8px;
        direction: rtl;
    }

    .atlas-desktop-hero__service--left .atlas-desktop-hero__service-copy {
        text-align: right;
    }

    .atlas-desktop-hero__service--right .atlas-desktop-hero__service-copy {
        text-align: left;
    }

    .atlas-desktop-hero__service-copy strong {
        color: #fff;
        font-family: IRANSansfanum, IRANSans, sans-serif;
        font-size: clamp(22px, 1.75vw, 34px);
        font-weight: 700;
        line-height: 1.35;
        white-space: nowrap;
        text-shadow: 0 3px 16px rgba(0, 22, 71, .45);
        transition: text-shadow .35s ease, transform .45s cubic-bezier(.2, .8, .2, 1);
    }

    .atlas-desktop-hero__service-copy small {
        direction: ltr;
        color: rgba(255, 255, 255, .86);
        font-family: Arial, sans-serif;
        font-size: clamp(9px, .7vw, 13px);
        font-weight: 600;
        line-height: 1.2;
        letter-spacing: clamp(2px, .25vw, 5px);
        white-space: nowrap;
        transition: color .35s ease, transform .45s cubic-bezier(.2, .8, .2, 1);
    }

    .atlas-desktop-hero__service:hover .atlas-desktop-hero__service-copy strong,
    .atlas-desktop-hero__service:focus-visible .atlas-desktop-hero__service-copy strong {
        text-shadow:
            0 0 20px rgba(255, 255, 255, .32),
            0 3px 16px rgba(0, 22, 71, .45);
    }

    .atlas-desktop-hero__service--left:hover .atlas-desktop-hero__service-copy strong,
    .atlas-desktop-hero__service--left:hover .atlas-desktop-hero__service-copy small,
    .atlas-desktop-hero__service--left:focus-visible .atlas-desktop-hero__service-copy strong,
    .atlas-desktop-hero__service--left:focus-visible .atlas-desktop-hero__service-copy small {
        transform: translateX(4px);
    }

    .atlas-desktop-hero__service--right:hover .atlas-desktop-hero__service-copy strong,
    .atlas-desktop-hero__service--right:hover .atlas-desktop-hero__service-copy small,
    .atlas-desktop-hero__service--right:focus-visible .atlas-desktop-hero__service-copy strong,
    .atlas-desktop-hero__service--right:focus-visible .atlas-desktop-hero__service-copy small {
        transform: translateX(-4px);
    }

    .atlas-desktop-hero__service:hover .atlas-desktop-hero__service-copy small,
    .atlas-desktop-hero__service:focus-visible .atlas-desktop-hero__service-copy small {
        color: #fff;
    }

    .atlas-desktop-hero__service-icon {
        position: relative;
        z-index: 3;
        display: grid;
        width: clamp(74px, 5.2vw, 100px);
        aspect-ratio: 1;
        flex: 0 0 auto;
        place-items: center;
        border: 1px solid rgba(255, 255, 255, .92);
        border-radius: 50%;
        background: rgba(4, 49, 137, .68);
        box-shadow:
            inset 0 0 0 5px rgba(255, 255, 255, .04),
            inset 0 0 30px rgba(49, 135, 255, .15),
            0 0 0 3px rgba(255, 182, 62, .92),
            0 0 0 6px rgba(255, 255, 255, .1),
            0 12px 30px rgba(0, 22, 72, .22);
        transition: transform .28s ease, box-shadow .28s ease, background .28s ease;
    }

    .atlas-desktop-hero__service-icon::before {
        position: absolute;
        inset: 9px;
        content: "";
        border: 1px solid rgba(255, 255, 255, .24);
        border-radius: 50%;
    }

    .atlas-desktop-hero__service-icon::after {
        position: absolute;
        inset: -11px;
        content: "";
        border: 1px dashed rgba(255, 213, 137, .8);
        border-radius: 50%;
        opacity: 0;
        pointer-events: none;
        transform: scale(.86) rotate(0deg);
        transition: opacity .28s ease;
    }

    .atlas-desktop-hero__service-icon img {
        display: block;
        width: 43%;
        max-height: 45%;
        object-fit: contain;
        filter: drop-shadow(0 0 7px rgba(255, 255, 255, .18));
        transition: filter .35s ease, transform .45s cubic-bezier(.2, .8, .2, 1);
    }

    .atlas-desktop-hero__service--enterprise .atlas-desktop-hero__service-icon img {
        width: 31%;
        max-height: 52%;
    }

    .atlas-desktop-hero__service:hover .atlas-desktop-hero__service-icon,
    .atlas-desktop-hero__service:focus-visible .atlas-desktop-hero__service-icon {
        background: rgba(6, 63, 164, .82);
        box-shadow:
            inset 0 0 0 5px rgba(255, 255, 255, .06),
            inset 0 0 34px rgba(67, 154, 255, .22),
            0 0 0 3px #ffbe51,
            0 0 0 7px rgba(255, 255, 255, .14),
            0 0 30px rgba(255, 182, 62, .26);
        transform: translateY(-2px) scale(1.07);
    }

    .atlas-desktop-hero__service:hover .atlas-desktop-hero__service-icon::after,
    .atlas-desktop-hero__service:focus-visible .atlas-desktop-hero__service-icon::after {
        opacity: 1;
        animation: atlas-service-ring 5s linear infinite;
    }

    .atlas-desktop-hero__service:hover .atlas-desktop-hero__service-icon img,
    .atlas-desktop-hero__service:focus-visible .atlas-desktop-hero__service-icon img {
        filter: drop-shadow(0 0 10px rgba(255, 255, 255, .4));
        transform: scale(1.12) rotate(-3deg);
    }

    .atlas-desktop-hero__connector {
        position: absolute;
        z-index: 1;
        top: 50%;
        display: block;
        width: 13%;
        height: 1px;
        background: linear-gradient(90deg, rgba(255, 182, 62, .2), #ffb63e, #fff4d8, #ffb63e, rgba(255, 182, 62, .2));
        background-size: 220% 100%;
        pointer-events: none;
    }

    .atlas-desktop-hero__service:hover .atlas-desktop-hero__connector,
    .atlas-desktop-hero__service:focus-visible .atlas-desktop-hero__connector {
        animation: atlas-connector-flow 1.15s linear infinite;
    }

    .atlas-desktop-hero__connector::before,
    .atlas-desktop-hero__connector i {
        position: absolute;
        top: 50%;
        display: block;
        width: 10px;
        height: 10px;
        content: "";
        border: 2px solid #ffcf7d;
        border-radius: 50%;
        background: #fff;
        box-shadow:
            0 0 0 6px rgba(255, 182, 62, .1),
            0 0 18px rgba(255, 182, 62, .82);
        transform: translateY(-50%);
    }

    .atlas-desktop-hero__service:hover .atlas-desktop-hero__connector::before,
    .atlas-desktop-hero__service:hover .atlas-desktop-hero__connector i,
    .atlas-desktop-hero__service:focus-visible .atlas-desktop-hero__connector::before,
    .atlas-desktop-hero__service:focus-visible .atlas-desktop-hero__connector i {
        animation: atlas-node-pulse .9s ease-in-out infinite alternate;
    }

    .atlas-desktop-hero__service--left .atlas-desktop-hero__connector {
        right: -9%;
    }

    .atlas-desktop-hero__service--left .atlas-desktop-hero__connector::before {
        right: -4px;
    }

    .atlas-desktop-hero__service--left .atlas-desktop-hero__connector i {
        left: -4px;
    }

    .atlas-desktop-hero__service--right .atlas-desktop-hero__connector {
        left: -9%;
    }

    .atlas-desktop-hero__service--right .atlas-desktop-hero__connector::before {
        left: -4px;
    }

    .atlas-desktop-hero__service--right .atlas-desktop-hero__connector i {
        right: -4px;
    }

    .atlas-desktop-hero__service--left {
        left: 4.2%;
    }

    .atlas-desktop-hero__service--right {
        right: 4.2%;
    }

    .atlas-desktop-hero__service--supply,
    .atlas-desktop-hero__service--logistics {
        top: 19%;
    }

    .atlas-desktop-hero__service--trade,
    .atlas-desktop-hero__service--enterprise {
        top: 43%;
    }

    .atlas-desktop-hero__service--it,
    .atlas-desktop-hero__service--telecom {
        top: 68.5%;
    }

    .atlas-desktop-hero__service:focus-visible,
    .atlas-desktop-hero__brand:focus-visible,
    .atlas-desktop-hero__scroll:focus-visible {
        outline: 3px solid rgba(255, 198, 94, .96);
        outline-offset: 4px;
    }

    .atlas-desktop-hero__scroll {
        position: absolute;
        z-index: 8;
        right: 50%;
        bottom: 18px;
        display: flex;
        align-items: center;
        gap: 10px;
        color: rgba(255, 255, 255, .74);
        font-family: IRANSansfanum, IRANSans, sans-serif;
        font-size: 11px;
        transform: translateX(50%);
        transition: color .25s ease, transform .25s ease;
    }

    .atlas-desktop-hero__scroll:hover {
        color: #fff;
        transform: translateX(50%) translateY(-2px);
    }

    .atlas-desktop-hero__scroll-mouse {
        position: relative;
        display: block;
        width: 22px;
        height: 34px;
        border: 1px solid rgba(255, 255, 255, .58);
        border-radius: 99px;
    }

    .atlas-desktop-hero__scroll-mouse i {
        position: absolute;
        top: 7px;
        right: 50%;
        display: block;
        width: 3px;
        height: 7px;
        border-radius: 99px;
        background: #ffb63e;
        transform: translateX(50%);
        animation: atlas-hero-scroll 1.6s ease-in-out infinite;
    }
}

@media (min-width: 992px) and (max-height: 760px) {
    .atlas-desktop-hero {
        min-height: 640px;
    }

    .atlas-desktop-hero__scroll {
        bottom: 10px;
    }
}

@media (max-width: 991.98px) {
    .atlas-desktop-hero {
        display: none !important;
    }

    .home-hero-legacy {
        display: block;
    }
}

@media (min-width: 992px) and (prefers-reduced-motion: reduce) {
    .atlas-desktop-hero__rotator,
    .atlas-desktop-hero__scroll-mouse i,
    .atlas-desktop-hero__service::after,
    .atlas-desktop-hero__service-icon::after,
    .atlas-desktop-hero__connector,
    .atlas-desktop-hero__connector::before,
    .atlas-desktop-hero__connector i {
        animation: none !important;
    }

    .atlas-desktop-hero__brand,
    .atlas-desktop-hero__brand::before,
    .atlas-desktop-hero__service,
    .atlas-desktop-hero__service::before,
    .atlas-desktop-hero__service-icon,
    .atlas-desktop-hero__service-icon::after,
    .atlas-desktop-hero__service-icon img,
    .atlas-desktop-hero__service-copy strong,
    .atlas-desktop-hero__service-copy small,
    .atlas-desktop-hero__scroll {
        transition: none;
    }
}

@keyframes atlas-service-sheen {
    0% {
        opacity: 0;
        transform: translateX(-125%);
    }
    38% {
        opacity: .8;
    }
    100% {
        opacity: 0;
        transform: translateX(125%);
    }
}

@keyframes atlas-service-ring {
    from {
        transform: scale(1) rotate(0deg);
    }
    to {
        transform: scale(1) rotate(360deg);
    }
}

@keyframes atlas-connector-flow {
    from {
        background-position: 100% 50%;
    }
    to {
        background-position: -100% 50%;
    }
}

@keyframes atlas-node-pulse {
    from {
        box-shadow:
            0 0 0 5px rgba(255, 182, 62, .08),
            0 0 14px rgba(255, 182, 62, .62);
        transform: translateY(-50%) scale(.88);
    }
    to {
        box-shadow:
            0 0 0 9px rgba(255, 182, 62, .13),
            0 0 24px rgba(255, 205, 117, .98);
        transform: translateY(-50%) scale(1.16);
    }
}

@keyframes atlas-orbit-spin {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }
    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

@keyframes atlas-hero-scroll {
    0%, 100% {
        opacity: .35;
        transform: translate(50%, 0);
    }
    50% {
        opacity: 1;
        transform: translate(50%, 10px);
    }
}