/*=========================================================
COMPANY HERO
=========================================================*/

.company-hero{

    position: relative;
    margin-top: 82px;
    min-height: 50vh;
    padding: 35px 0 10px;
    display: flex;
    align-items: center;
    overflow: hidden;

    background-color: #081B4B;
    background-image: url("../images/company-overview-hero.png");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;

}


/*=========================================================
DECORATIVE CIRCLES
=========================================================*/



/*=========================================================
HERO GRID
=========================================================*/

.company-hero-grid{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:52% 48%;

    gap:10px;

    align-items:center;

}


/*=========================================================
HERO CONTENT
=========================================================*/

.company-hero-content{

    position:relative;

    z-index:2;

    text-align:left;

    margin:0;

    max-width:600px;

    /* REMOVED -140px */
    margin-top:0;

}


/*=========================================================
HERO BADGE
=========================================================*/

.company-hero .hero-badge{

    display:inline-block;

    padding:10px 22px;

    border-radius:50px;

    background:rgba(255,255,255,.10);

    color:#fff;

    font-size:14px;

    letter-spacing:1px;

    margin-bottom:30px;

}


/*=========================================================
HERO HEADING
=========================================================*/

.company-hero h1{

    color:#fff;

    font-size:52px;

    line-height:1.08;

    margin-bottom:18px;

    font-weight:800;

}


/*=========================================================
HERO TEXT
=========================================================*/

.company-hero p{

    color:#D8E5FF;

    font-size:18px;

    line-height:1.7;

    margin-bottom:30px;

}


/*=========================================================
HERO BUTTONS
=========================================================*/

.company-hero .hero-buttons{

    display:flex;

    justify-content:flex-start;

    align-items:center;

    gap:20px;

}


/*=========================================================
OLD RIGHT IMAGE - HIDE IT
=========================================================*/

.company-hero-image{

    display:none;

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:991px){

    .company-hero-grid{

        grid-template-columns:1fr;

        text-align:center;

    }

    .company-hero-content{

        margin:auto;

        max-width:640px;

        text-align:center;

    }

    .company-hero .hero-buttons{

        justify-content:center;

    }

}


/*=========================================================
MOBILE
=========================================================*/

@media(max-width:576px){

    .company-hero h1{

        font-size:42px;

    }

    .company-hero{

        padding:100px 0 80px;

        background-position:center center;

    }

    .company-hero-content{

        margin-top:0;

    }

    .company-hero .hero-buttons{

        flex-direction:column;

        align-items:center;

    }

}
/*=========================================================
OUR JOURNEY
=========================================================*/

.our-journey{

    position:relative;

    padding:110px 0;

    background:#F8FBFF;

    overflow:hidden;

}


/*=========================================================
SECTION HEADING
=========================================================*/

.our-journey .section-heading{

    max-width:800px;

    margin:0 auto 90px;

    text-align:center;

}

.our-journey .section-heading span{

    display:inline-block;

    padding:10px 24px;

    margin-bottom:20px;

    border-radius:50px;

    background:#EAF3FF;

    color:#2F80ED;

    font-size:14px;

    font-weight:600;

    letter-spacing:1px;

    text-transform:uppercase;

}

.our-journey .section-heading h2{

    margin:0 0 22px;

    color:#081B4B;

    font-size:48px;

    line-height:1.2;

    font-weight:800;

}

.our-journey .section-heading p{

    margin:0;

    color:#64748B;

    font-size:18px;

    line-height:1.8;

}


/*=========================================================
TIMELINE
=========================================================*/

.journey-timeline{

    position:relative;

    max-width:1100px;

    margin:0 auto;

}


/*=========================================================
CENTRAL LINE
=========================================================*/

.journey-timeline::before{

    content:"";

    position:absolute;

    top:0;

    bottom:0;

    left:50%;

    width:2px;

    background:linear-gradient(
        to bottom,
        transparent,
        #C9DBFA 8%,
        #C9DBFA 92%,
        transparent
    );

    transform:translateX(-50%);

}


/*=========================================================
TIMELINE ROW
=========================================================*/

.journey-row{

    display:grid;

    grid-template-columns:1fr 90px 1fr;

    align-items:center;

    min-height:250px;

    position:relative;

}


/*=========================================================
MARKER
=========================================================*/

.journey-marker{

    position:relative;

    z-index:3;

    display:flex;

    justify-content:center;

    align-items:center;

}

.journey-marker span{

    width:76px;

    height:76px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:linear-gradient(
        135deg,
        #2F80ED,
        #123C8D
    );

    color:#fff;

    font-size:21px;

    font-weight:700;

    border:8px solid #F8FBFF;

    box-shadow:
        0 12px 30px rgba(47,128,237,.28);

    transition:.35s ease;

}

.journey-row:hover .journey-marker span{

    transform:scale(1.12);

    box-shadow:
        0 18px 40px rgba(47,128,237,.40);

}


/*=========================================================
CONTENT
=========================================================*/

.journey-content{

    position:relative;

}

.journey-left{

    padding-right:45px;

}

.journey-right{

    padding-left:45px;

}


/*=========================================================
CARDS
=========================================================*/

.journey-card{

    position:relative;

    padding:35px 38px;

    background:#ffffff;

    border:1px solid #E8EEF7;

    border-radius:22px;

    box-shadow:
        0 15px 40px rgba(15,23,42,.06);

    transition:.35s ease;

}

.journey-card::after{

    content:"";

    position:absolute;

    top:50%;

    width:45px;

    height:1px;

    background:#C9DBFA;

}

.journey-left .journey-card::after{

    right:-45px;

}

.journey-right .journey-card::after{

    left:-45px;

}

.journey-card:hover{

    transform:translateY(-7px);

    border-color:#BBD3FA;

    box-shadow:
        0 25px 55px rgba(15,23,42,.11);

}


/*=========================================================
LABEL
=========================================================*/

.journey-label{

    display:inline-block;

    margin-bottom:12px;

    color:#2F80ED;

    font-size:12px;

    font-weight:700;

    letter-spacing:1.5px;

}


/*=========================================================
TITLE
=========================================================*/

.journey-card h3{

    margin:0 0 14px;

    color:#081B4B;

    font-size:27px;

    line-height:1.25;

    font-weight:700;

}


/*=========================================================
DESCRIPTION
=========================================================*/

.journey-card p{

    margin:0;

    color:#64748B;

    font-size:16px;

    line-height:1.8;

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:991px){

    .our-journey{

        padding:90px 0;

    }

    .our-journey .section-heading h2{

        font-size:40px;

    }

    .journey-row{

        grid-template-columns:70px 1fr;

        min-height:auto;

        margin-bottom:45px;

    }

    .journey-timeline::before{

        left:35px;

    }

    .journey-marker{

        grid-column:1;

        grid-row:1;

    }

    .journey-marker span{

        width:64px;

        height:64px;

        font-size:18px;

    }

    .journey-content{

        grid-column:2;

        grid-row:1;

        padding:0 0 0 25px;

    }

    .journey-empty{

        display:none;

    }

    .journey-left .journey-card::after,
    .journey-right .journey-card::after{

        left:-25px;

        right:auto;

    }

}


/*=========================================================
MOBILE
=========================================================*/

@media(max-width:576px){

    .our-journey{

        padding:70px 0;

    }

    .our-journey .section-heading{

        margin-bottom:60px;

    }

    .our-journey .section-heading h2{

        font-size:34px;

    }

    .our-journey .section-heading p{

        font-size:16px;

    }

    .journey-row{

        grid-template-columns:55px 1fr;

        margin-bottom:35px;

    }

    .journey-timeline::before{

        left:27px;

    }

    .journey-marker span{

        width:52px;

        height:52px;

        border-width:6px;

        font-size:15px;

    }

    .journey-content{

        padding-left:18px;

    }

    .journey-left .journey-card::after,
    .journey-right .journey-card::after{

        left:-18px;

    }

    .journey-card{

        padding:25px 22px;

        border-radius:18px;

    }

    .journey-card h3{

        font-size:22px;

    }

    .journey-card p{

        font-size:15px;

    }

}
/*=========================================================
CORE CAPABILITIES
=========================================================*/

.core-capabilities{

    padding:110px 0;

    background:#ffffff;

}


/*=========================================================
SECTION HEADING
=========================================================*/

.core-capabilities .section-heading{

    max-width:780px;

    margin:0 auto 70px;

    text-align:center;

}

.core-capabilities .section-heading span{

    display:inline-block;

    padding:10px 24px;

    margin-bottom:20px;

    border-radius:50px;

    background:#EAF3FF;

    color:#2F80ED;

    font-size:14px;

    font-weight:600;

    letter-spacing:1px;

    text-transform:uppercase;

}

.core-capabilities .section-heading h2{

    margin:0 0 22px;

    color:#081B4B;

    font-size:48px;

    line-height:1.2;

    font-weight:800;

}

.core-capabilities .section-heading p{

    margin:0;

    color:#64748B;

    font-size:18px;

    line-height:1.8;

}


/*=========================================================
CAPABILITIES GRID
=========================================================*/

.capabilities-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:28px;

}


/*=========================================================
CAPABILITY CARD
=========================================================*/

.capability-card{

    position:relative;

    padding:35px;

    background:#ffffff;

    border:1px solid #E8EEF7;

    border-radius:22px;

    min-height:330px;

    display:flex;

    flex-direction:column;

    overflow:hidden;

    transition:.35s ease;

}

.capability-card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:4px;

    background:linear-gradient(
        90deg,
        #2F80ED,
        #123C8D
    );

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s ease;

}

.capability-card:hover{

    transform:translateY(-8px);

    border-color:#C8DCF9;

    box-shadow:
        0 25px 60px rgba(15,23,42,.10);

}

.capability-card:hover::before{

    transform:scaleX(1);

}


/*=========================================================
ICON
=========================================================*/

.capability-icon{

    width:68px;

    height:68px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:18px;

    background:#EAF3FF;

    margin-bottom:25px;

    transition:.35s ease;

}

.capability-icon img{

    width:34px;

    height:34px;

    object-fit:contain;

}

.capability-card:hover .capability-icon{

    background:#2F80ED;

}

.capability-card:hover .capability-icon img{

    filter:brightness(0) invert(1);

}


/*=========================================================
NUMBER
=========================================================*/

.capability-number{

    position:absolute;

    top:32px;

    right:32px;

    color:#DCE8F9;

    font-size:15px;

    font-weight:700;

}


/*=========================================================
TITLE
=========================================================*/

.capability-card h3{

    margin:0 0 15px;

    color:#081B4B;

    font-size:23px;

    line-height:1.3;

    font-weight:700;

}


/*=========================================================
DESCRIPTION
=========================================================*/

.capability-card p{

    margin:0;

    color:#64748B;

    font-size:16px;

    line-height:1.75;

}


/*=========================================================
LINK
=========================================================*/

.capability-card a{

    margin-top:auto;

    padding-top:25px;

    color:#2F80ED;

    text-decoration:none;

    font-size:15px;

    font-weight:600;

    transition:.3s ease;

}

.capability-card a:hover{

    color:#123C8D;

    transform:translateX(4px);

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:991px){

    .core-capabilities{

        padding:90px 0;

    }

    .core-capabilities .section-heading h2{

        font-size:40px;

    }

    .capabilities-grid{

        grid-template-columns:repeat(2,1fr);

    }

}


/*=========================================================
MOBILE
=========================================================*/

@media(max-width:576px){

    .core-capabilities{

        padding:70px 0;

    }

    .core-capabilities .section-heading h2{

        font-size:34px;

    }

    .core-capabilities .section-heading p{

        font-size:16px;

    }

    .capabilities-grid{

        grid-template-columns:1fr;

    }

    .capability-card{

        min-height:300px;

        padding:30px;

    }

}
/*=========================================================
INDUSTRIES WE EMPOWER
=========================================================*/

.industries-section{

    padding:110px 0;

    background:#F7FAFF;

}

.industries-section .section-heading{

    max-width:800px;

    margin:0 auto 70px;

    text-align:center;

}

.industries-section .section-heading span{

    display:inline-block;

    padding:10px 24px;

    margin-bottom:20px;

    border-radius:50px;

    background:#EAF3FF;

    color:#2F80ED;

    font-size:14px;

    font-weight:600;

    letter-spacing:1px;

    text-transform:uppercase;

}

.industries-section .section-heading h2{

    margin:0 0 22px;

    color:#081B4B;

    font-size:48px;

    line-height:1.2;

    font-weight:800;

}

.industries-section .section-heading p{

    margin:0;

    color:#64748B;

    font-size:18px;

    line-height:1.8;

}


/*=========================================================
INDUSTRY GRID
=========================================================*/

.industries-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:28px;

}

.industry-card{

    position:relative;

    padding:35px;

    background:#ffffff;

    border:1px solid #E6EDF7;

    border-radius:22px;

    min-height:280px;

    overflow:hidden;

    transition:.35s ease;

}

.industry-card:hover{

    transform:translateY(-8px);

    border-color:#C6DAF8;

    box-shadow:0 25px 55px rgba(15,23,42,.09);

}


/*=========================================================
ICON
=========================================================*/

.industry-icon{

    width:64px;

    height:64px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:25px;

    border-radius:17px;

    background:#EAF3FF;

}

.industry-icon img{

    width:32px;

    height:32px;

    object-fit:contain;

}


/*=========================================================
TITLE
=========================================================*/

.industry-card h3{

    margin:0 0 14px;

    color:#081B4B;

    font-size:23px;

    line-height:1.3;

    font-weight:700;

}


/*=========================================================
DESCRIPTION
=========================================================*/

.industry-card p{

    margin:0;

    color:#64748B;

    font-size:16px;

    line-height:1.75;

}


/*=========================================================
NUMBER
=========================================================*/

.industry-number{

    position:absolute;

    right:28px;

    top:28px;

    color:#DCE8F9;

    font-size:15px;

    font-weight:700;

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:991px){

    .industries-section{

        padding:90px 0;

    }

    .industries-section .section-heading h2{

        font-size:40px;

    }

    .industries-grid{

        grid-template-columns:repeat(2,1fr);

    }

}


/*=========================================================
MOBILE
=========================================================*/

@media(max-width:576px){

    .industries-section{

        padding:70px 0;

    }

    .industries-section .section-heading h2{

        font-size:34px;

    }

    .industries-section .section-heading p{

        font-size:16px;

    }

    .industries-grid{

        grid-template-columns:1fr;

    }

    .industry-card{

        min-height:250px;

        padding:30px;

    }

}
/*=========================================================
WHY ARPIVA
=========================================================*/

.why-arpiva{

    padding:110px 0;

    background:#ffffff;

}

.why-arpiva .section-heading{

    max-width:780px;

    margin:0 auto 70px;

    text-align:center;

}

.why-arpiva .section-heading span{

    display:inline-block;

    padding:10px 24px;

    margin-bottom:20px;

    border-radius:50px;

    background:#EAF3FF;

    color:#2F80ED;

    font-size:14px;

    font-weight:600;

    letter-spacing:1px;

    text-transform:uppercase;

}

.why-arpiva .section-heading h2{

    margin:0 0 22px;

    color:#081B4B;

    font-size:48px;

    line-height:1.2;

    font-weight:800;

}

.why-arpiva .section-heading p{

    margin:0;

    color:#64748B;

    font-size:18px;

    line-height:1.8;

}


/*=========================================================
GRID
=========================================================*/

.why-arpiva-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:25px;

}


/*=========================================================
CARD
=========================================================*/

.why-arpiva-card{

    display:flex;

    align-items:flex-start;

    gap:25px;

    padding:32px;

    background:#F8FBFF;

    border:1px solid #E7EEF8;

    border-radius:22px;

    transition:.35s ease;

}

.why-arpiva-card:hover{

    transform:translateY(-6px);

    background:#ffffff;

    border-color:#C8DCF9;

    box-shadow:0 22px 50px rgba(15,23,42,.08);

}


/*=========================================================
NUMBER ICON
=========================================================*/

.why-icon{

    flex-shrink:0;

    width:62px;

    height:62px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:17px;

    background:linear-gradient(
        135deg,
        #2F80ED,
        #123C8D
    );

    box-shadow:0 12px 28px rgba(47,128,237,.20);

}

.why-icon span{

    color:#ffffff;

    font-size:16px;

    font-weight:700;

}


/*=========================================================
TEXT
=========================================================*/

.why-arpiva-card h3{

    margin:2px 0 12px;

    color:#081B4B;

    font-size:22px;

    line-height:1.3;

    font-weight:700;

}

.why-arpiva-card p{

    margin:0;

    color:#64748B;

    font-size:16px;

    line-height:1.75;

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:991px){

    .why-arpiva{

        padding:90px 0;

    }

    .why-arpiva .section-heading h2{

        font-size:40px;

    }

    .why-arpiva-grid{

        grid-template-columns:1fr;

    }

}


/*=========================================================
MOBILE
=========================================================*/

@media(max-width:576px){

    .why-arpiva{

        padding:70px 0;

    }

    .why-arpiva .section-heading h2{

        font-size:34px;

    }

    .why-arpiva .section-heading p{

        font-size:16px;

    }

    .why-arpiva-card{

        padding:25px;

        gap:18px;

    }

    .why-icon{

        width:54px;

        height:54px;

    }

    .why-arpiva-card h3{

        font-size:20px;

    }

}
/*=========================================================
TECHNOLOGY & INNOVATION
=========================================================*/

.technology-section{

    padding:110px 0;

    background:#081B4B;

    position:relative;

    overflow:hidden;

}

.technology-section::before{

    content:"";

    position:absolute;

    width:500px;

    height:500px;

    border-radius:50%;

    top:-250px;

    right:-150px;

    background:rgba(47,128,237,.12);

}

.technology-section::after{

    content:"";

    position:absolute;

    width:400px;

    height:400px;

    border-radius:50%;

    bottom:-250px;

    left:-150px;

    background:rgba(255,255,255,.04);

}

.technology-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:80px;

    align-items:center;

    position:relative;

    z-index:2;

}


/*=========================================================
CONTENT
=========================================================*/

.technology-content{

    max-width:650px;

}

.technology-badge{

    display:inline-block;

    padding:10px 24px;

    margin-bottom:22px;

    border-radius:50px;

    background:rgba(255,255,255,.10);

    color:#8DBBFF;

    font-size:14px;

    font-weight:600;

    letter-spacing:1px;

}

.technology-content h2{

    margin:0 0 25px;

    color:#ffffff;

    font-size:48px;

    line-height:1.2;

    font-weight:800;

}

.technology-content p{

    margin:0 0 20px;

    color:#C9D8F2;

    font-size:17px;

    line-height:1.8;

}


/*=========================================================
POINTS
=========================================================*/

.technology-points{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:18px;

    margin-top:35px;

}

.technology-point{

    display:flex;

    align-items:center;

    gap:12px;

    color:#ffffff;

    font-size:16px;

}

.technology-point span{

    width:28px;

    height:28px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#2F80ED;

    color:#ffffff;

    font-size:13px;

}


/*=========================================================
VISUAL
=========================================================*/

.technology-visual{

    position:relative;

    width:520px;

    height:520px;

    margin:auto;

    display:flex;

    align-items:center;

    justify-content:center;

}

.technology-orbit{

    position:absolute;

    border:1px solid rgba(141,187,255,.25);

    border-radius:50%;

}

.orbit-one{

    width:400px;

    height:400px;

}

.orbit-two{

    width:280px;

    height:280px;

}

.technology-center{

    width:170px;

    height:170px;

    border-radius:50%;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    background:linear-gradient(
        135deg,
        #2F80ED,
        #123C8D
    );

    color:#ffffff;

    box-shadow:
        0 25px 70px rgba(47,128,237,.35);

    position:relative;

    z-index:3;

}

.technology-center span{

    font-size:13px;

    letter-spacing:2px;

    opacity:.8;

    margin-bottom:7px;

}

.technology-center strong{

    font-size:20px;

    line-height:1.2;

}


/*=========================================================
NODES
=========================================================*/

.technology-node{

    position:absolute;

    width:68px;

    height:68px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#ffffff;

    color:#123C8D;

    font-size:14px;

    font-weight:700;

    box-shadow:0 15px 35px rgba(0,0,0,.20);

    z-index:4;

}

.node-one{

    top:55px;

    left:220px;

}

.node-two{

    right:35px;

    top:215px;

}

.node-three{

    bottom:55px;

    left:220px;

}

.node-four{

    left:35px;

    top:215px;

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:991px){

    .technology-section{

        padding:90px 0;

    }

    .technology-grid{

        grid-template-columns:1fr;

        gap:60px;

    }

    .technology-content{

        max-width:100%;

        text-align:center;

        margin:auto;

    }

    .technology-points{

        text-align:left;

    }

}


/*=========================================================
MOBILE
=========================================================*/

@media(max-width:576px){

    .technology-section{

        padding:70px 0;

    }

    .technology-content h2{

        font-size:34px;

    }

    .technology-content p{

        font-size:16px;

    }

    .technology-points{

        grid-template-columns:1fr;

    }

    .technology-visual{

        width:320px;

        height:320px;

    }

    .orbit-one{

        width:270px;

        height:270px;

    }

    .orbit-two{

        width:190px;

        height:190px;

    }

    .technology-center{

        width:120px;

        height:120px;

    }

    .technology-center strong{

        font-size:14px;

    }

    .technology-node{

        width:48px;

        height:48px;

        font-size:11px;

    }

    .node-one{

        top:20px;

        left:136px;

    }

    .node-two{

        right:10px;

        top:136px;

    }

    .node-three{

        bottom:20px;

        left:136px;

    }

    .node-four{

        left:10px;

        top:136px;

    }

}
/*=========================================================
TECHNOLOGY & INNOVATION
PREMIUM ANIMATION SYSTEM
=========================================================*/

/*---------------------------------------------------------
1. MAIN VISUAL ENTRANCE
---------------------------------------------------------*/

.technology-visual{

    animation:technologyVisualIn 1.2s ease-out both;

}

@keyframes technologyVisualIn{

    from{

        opacity:0;

        transform:scale(.88);

    }

    to{

        opacity:1;

        transform:scale(1);

    }

}


/*---------------------------------------------------------
2. OUTER ORBIT
---------------------------------------------------------*/

.orbit-one{

    animation:
        arpivaOrbitClockwise 24s linear infinite;

    transform-origin:center;

}

@keyframes arpivaOrbitClockwise{

    from{

        transform:rotate(0deg);

    }

    to{

        transform:rotate(360deg);

    }

}


/*---------------------------------------------------------
3. INNER ORBIT
---------------------------------------------------------*/

.orbit-two{

    animation:
        arpivaOrbitAntiClockwise 17s linear infinite;

    transform-origin:center;

}

@keyframes arpivaOrbitAntiClockwise{

    from{

        transform:rotate(360deg);

    }

    to{

        transform:rotate(0deg);

    }

}


/*---------------------------------------------------------
4. CENTER ARPIVA CORE
---------------------------------------------------------*/

.technology-center{

    animation:
        arpivaCorePulse 4s ease-in-out infinite;

}

@keyframes arpivaCorePulse{

    0%,
    100%{

        transform:scale(1);

        box-shadow:
            0 25px 70px rgba(47,128,237,.32),
            0 0 0 rgba(47,128,237,0);

    }

    50%{

        transform:scale(1.055);

        box-shadow:
            0 30px 90px rgba(47,128,237,.50),
            0 0 35px rgba(47,128,237,.18);

    }

}


/*---------------------------------------------------------
5. TECHNOLOGY NODES
---------------------------------------------------------*/

.technology-node{

    animation:
        arpivaNodeFloat 4s ease-in-out infinite;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        background .35s ease,
        color .35s ease;

}


/* Different timing for natural movement */

.node-one{

    animation-delay:0s;

}

.node-two{

    animation-delay:.8s;

}

.node-three{

    animation-delay:1.6s;

}

.node-four{

    animation-delay:2.4s;

}


@keyframes arpivaNodeFloat{

    0%,
    100%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-12px);

    }

}


/*---------------------------------------------------------
6. NODE HOVER
---------------------------------------------------------*/

.technology-node:hover{

    transform:scale(1.15) translateY(-4px);

    background:#2F80ED;

    color:#ffffff;

    box-shadow:
        0 20px 45px rgba(47,128,237,.40);

}


/*---------------------------------------------------------
7. ORBIT GLOW
---------------------------------------------------------*/

.orbit-one::after,
.orbit-two::after{

    content:"";

    position:absolute;

    inset:-2px;

    border-radius:50%;

    border:1px solid rgba(82,155,255,.08);

    box-shadow:
        0 0 20px rgba(47,128,237,.08);

}


/*---------------------------------------------------------
8. SUBTLE VISUAL FLOAT
---------------------------------------------------------*/

.technology-visual{

    animation:
        technologyVisualIn 1.2s ease-out both,
        technologyFloat 7s ease-in-out 1.2s infinite;

}

@keyframes technologyFloat{

    0%,
    100%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-8px);

    }

}


/*---------------------------------------------------------
9. CONTENT ENTRANCE
---------------------------------------------------------*/

.technology-content{

    animation:
        technologyContentIn 1s ease-out .15s both;

}

@keyframes technologyContentIn{

    from{

        opacity:0;

        transform:translateX(-35px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}


/*---------------------------------------------------------
10. TECHNOLOGY POINTS
---------------------------------------------------------*/

.technology-point{

    transition:
        transform .3s ease,
        color .3s ease;

}

.technology-point:hover{

    transform:translateX(6px);

}

.technology-point span{

    transition:
        transform .3s ease,
        box-shadow .3s ease;

}

.technology-point:hover span{

    transform:scale(1.12);

    box-shadow:
        0 8px 20px rgba(47,128,237,.35);

}


/*---------------------------------------------------------
11. BADGE GLOW
---------------------------------------------------------*/

.technology-badge{

    animation:
        technologyBadgeGlow 4s ease-in-out infinite;

}

@keyframes technologyBadgeGlow{

    0%,
    100%{

        box-shadow:
            0 0 0 rgba(141,187,255,0);

    }

    50%{

        box-shadow:
            0 0 25px rgba(141,187,255,.08);

    }

}


/*---------------------------------------------------------
12. MOBILE PERFORMANCE
---------------------------------------------------------*/

@media(max-width:576px){

    .technology-visual{

        animation:
            technologyVisualIn 1s ease-out both;

    }

    .technology-node{

        animation:
            arpivaNodeFloat 5s ease-in-out infinite;

    }

    .technology-center{

        animation:
            arpivaCorePulse 5s ease-in-out infinite;

    }

}


/*---------------------------------------------------------
13. ACCESSIBILITY
---------------------------------------------------------*/

@media(prefers-reduced-motion:reduce){

    .technology-visual,
    .technology-content,
    .technology-center,
    .technology-node,
    .orbit-one,
    .orbit-two,
    .technology-badge{

        animation:none !important;

        transition:none !important;

    }

}
/*=========================================================
FINAL COMPANY CTA
=========================================================*/

.company-cta{

    padding:110px 0;

    background:#F7FAFF;

}

.company-cta-box{

    position:relative;

    overflow:hidden;

    padding:90px 70px;

    border-radius:32px;

    background:
        linear-gradient(
            135deg,
            #081B4B 0%,
            #123C8D 55%,
            #1458C7 100%
        );

    text-align:center;

    box-shadow:
        0 30px 80px rgba(8,27,75,.20);

}


/*=========================================================
GLOW EFFECTS
=========================================================*/

.cta-glow{

    position:absolute;

    border-radius:50%;

    pointer-events:none;

}

.cta-glow-one{

    width:400px;

    height:400px;

    top:-220px;

    right:-120px;

    background:rgba(82,155,255,.18);

    filter:blur(2px);

    animation:ctaGlowOne 7s ease-in-out infinite;

}

.cta-glow-two{

    width:320px;

    height:320px;

    bottom:-200px;

    left:-100px;

    background:rgba(255,255,255,.07);

    animation:ctaGlowTwo 8s ease-in-out infinite;

}

@keyframes ctaGlowOne{

    0%,
    100%{

        transform:scale(1);

        opacity:.7;

    }

    50%{

        transform:scale(1.18);

        opacity:1;

    }

}

@keyframes ctaGlowTwo{

    0%,
    100%{

        transform:translate(0,0);

    }

    50%{

        transform:translate(35px,-20px);

    }

}


/*=========================================================
CTA CONTENT
=========================================================*/

.company-cta-content{

    position:relative;

    z-index:2;

    max-width:850px;

    margin:auto;

    animation:ctaContentIn 1s ease-out both;

}

@keyframes ctaContentIn{

    from{

        opacity:0;

        transform:translateY(25px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}


/*=========================================================
BADGE
=========================================================*/

.cta-badge{

    display:inline-block;

    padding:10px 24px;

    margin-bottom:22px;

    border-radius:50px;

    background:rgba(255,255,255,.10);

    border:1px solid rgba(255,255,255,.12);

    color:#9CC5FF;

    font-size:13px;

    font-weight:600;

    letter-spacing:1.5px;

}


/*=========================================================
HEADING
=========================================================*/

.company-cta h2{

    margin:0 0 22px;

    color:#ffffff;

    font-size:50px;

    line-height:1.15;

    font-weight:800;

}

.company-cta p{

    max-width:720px;

    margin:0 auto 35px;

    color:#D5E2F8;

    font-size:18px;

    line-height:1.8;

}


/*=========================================================
BUTTONS
=========================================================*/

.company-cta-buttons{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:18px;

}

.cta-primary,
.cta-secondary{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    min-height:56px;

    padding:0 30px;

    border-radius:14px;

    text-decoration:none;

    font-size:16px;

    font-weight:600;

    transition:.35s ease;

}

.cta-primary{

    background:#FF9F1C;

    color:#ffffff;

    box-shadow:
        0 15px 35px rgba(255,159,28,.30);

}

.cta-primary:hover{

    transform:translateY(-4px);

    box-shadow:
        0 22px 45px rgba(255,159,28,.45);

}

.cta-secondary{

    color:#ffffff;

    border:1px solid rgba(255,255,255,.25);

    background:rgba(255,255,255,.06);

}

.cta-secondary:hover{

    transform:translateY(-4px);

    background:rgba(255,255,255,.12);

    border-color:rgba(255,255,255,.40);

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:991px){

    .company-cta{

        padding:90px 0;

    }

    .company-cta-box{

        padding:75px 45px;

    }

    .company-cta h2{

        font-size:42px;

    }

}


/*=========================================================
MOBILE
=========================================================*/

@media(max-width:576px){

    .company-cta{

        padding:70px 0;

    }

    .company-cta-box{

        padding:60px 25px;

        border-radius:24px;

    }

    .company-cta h2{

        font-size:34px;

    }

    .company-cta p{

        font-size:16px;

    }

    .company-cta-buttons{

        flex-direction:column;

        width:100%;

    }

    .cta-primary,
    .cta-secondary{

        width:100%;

    }

}