:root{
    --bg:#020405;
    --bg-deep:#010203;
    --panel:rgba(255,255,255,.028);
    --panel-2:rgba(255,255,255,.045);

    --text:#f4f7f8;
    --text-soft:#d9e1e4;
    --muted:#8f9ca3;
    --muted-2:#66767d;

    --cold:#d9f9ff;
    --cold-2:#83def1;
    --cold-3:#397f90;
    --cold-4:#1d5664;

    --line:rgba(207,242,250,.12);
    --line-strong:rgba(207,242,250,.24);

    --shell:1420px;
}


/* =========================================================
   RESET
   ========================================================= */

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    min-width:320px;

    overflow-x:hidden;

    background:#020405;

    color:var(--text);

    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    -webkit-font-smoothing:antialiased;
}

a{
    color:inherit;
    text-decoration:none;
}

.shell{
    width:min(
        calc(100% - 72px),
        var(--shell)
    );

    margin-inline:auto;
}


/* =========================================================
   GLOBAL FUTURISTIC ATMOSPHERE
   ========================================================= */

.site-atmosphere{
    position:fixed;

    inset:0;

    z-index:-20;

    overflow:hidden;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 72% 18%,
            rgba(74,183,207,.08),
            transparent 24%
        ),

        radial-gradient(
            circle at 18% 72%,
            rgba(54,132,150,.05),
            transparent 20%
        ),

        linear-gradient(
            180deg,
            #020405,
            #010304
        );
}


#signal-canvas{
    position:absolute;

    inset:0;

    width:100%;
    height:100%;

    opacity:.66;
}


.circuit-layer{
    position:absolute;

    inset:-10%;

    opacity:.22;

    background-image:

        linear-gradient(
            rgba(131,214,233,.03) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(131,214,233,.03) 1px,
            transparent 1px
        );

    background-size:
        72px
        72px;

    transform:
        perspective(1100px)
        rotateX(69deg)
        scale(1.4)
        translateY(26%);

    transform-origin:
        center
        72%;

    mask-image:
        linear-gradient(
            to bottom,
            transparent 0%,
            #000 24%,
            #000 77%,
            transparent 100%
        );
}


.noise-layer{
    position:absolute;

    inset:0;

    opacity:.035;

    background-image:
        repeating-linear-gradient(
            0deg,
            rgba(255,255,255,.05) 0,
            rgba(255,255,255,.05) 1px,
            transparent 1px,
            transparent 4px
        );
}


/* =========================================================
   HEADER
   ========================================================= */

.site-header{
    position:fixed;

    inset:
        0
        0
        auto;

    z-index:100;

    border-bottom:
        1px solid
        transparent;

    transition:
        background .3s ease,
        border-color .3s ease;
}


.site-header.scrolled{
    background:
        rgba(
            2,
            4,
            5,
            .80
        );

    backdrop-filter:
        blur(20px);

    -webkit-backdrop-filter:
        blur(20px);

    border-color:
        var(--line);
}


.header-inner{
    min-height:88px;

    display:flex;

    align-items:center;

    justify-content:
        space-between;
}


.brand{
    display:inline-flex;

    align-items:
        baseline;

    gap:5px;

    font-size:18px;

    font-weight:850;

    letter-spacing:.16em;
}


.brand span{
    color:#fff;
}


.brand b{
    color:#eefafd;

    font-size:24px;

    text-shadow:
        0 0 12px
        rgba(133,219,239,.28),

        0 0 34px
        rgba(133,219,239,.12);
}


.site-nav{
    display:flex;

    align-items:center;

    gap:30px;

    color:#c5cdd0;

    font-size:14px;
}


.site-nav a{
    position:relative;
}


.site-nav a::after{
    content:"";

    position:absolute;

    left:0;

    right:100%;

    bottom:-9px;

    height:1px;

    background:
        var(--cold-2);

    transition:
        .25s ease;
}


.site-nav a:hover::after{
    right:0;
}


.nav-divider{
    width:1px;

    height:18px;

    background:
        var(--line);
}


.byline{
    color:#7f8b91;
}


.menu-toggle{
    display:none;
}


/* =========================================================
   HERO
   APPROVED BASELINE
   ========================================================= */

.hero-v6{
    position:relative;

    min-height:100svh;

    isolation:isolate;

    overflow:hidden;

    display:flex;

    align-items:center;

    border-bottom:
        1px solid
        var(--line);

    background:

        radial-gradient(
            circle at 72% 42%,
            rgba(95,205,229,.08),
            transparent 18%
        ),

        linear-gradient(
            90deg,
            rgba(1,3,4,.91) 0%,
            rgba(1,4,5,.63) 47%,
            rgba(1,3,4,.76) 100%
        );
}


.hero-v6::before{
    content:"";

    position:absolute;

    inset:0;

    z-index:-8;

    background:

        radial-gradient(
            circle at 74% 45%,
            rgba(111,218,240,.09),
            transparent 16%
        ),

        radial-gradient(
            circle at 22% 62%,
            rgba(67,144,162,.035),
            transparent 24%
        );
}


.hero-shell{
    position:relative;

    z-index:5;

    padding-top:118px;

    padding-bottom:56px;
}


.hero-kicker{
    display:flex;

    align-items:center;

    gap:13px;

    color:#a9bbc1;

    font-size:10px;

    font-weight:760;

    letter-spacing:.24em;
}


.hero-kicker i{
    width:42px;

    height:1px;

    background:
        linear-gradient(
            90deg,
            var(--cold-3),
            transparent
        );
}


.signal-dot{
    width:6px;

    height:6px;

    border-radius:50%;

    background:
        var(--cold-2);

    box-shadow:
        0 0 14px
        rgba(120,213,235,.85);

    animation:
        signalPulse
        2s
        infinite;
}


@keyframes signalPulse{

    0%,
    100%{
        opacity:.45;

        transform:
            scale(.85);
    }

    50%{
        opacity:1;

        transform:
            scale(1.2);
    }

}


.hero-wordmark{
    margin:
        26px
        0
        0;

    width:
        min(
            100%,
            1110px
        );

    display:flex;

    align-items:
        baseline;

    gap:.025em;

    font-size:
        clamp(
            76px,
            9.4vw,
            148px
        );

    line-height:.80;

    letter-spacing:-.068em;

    font-weight:790;
}


.hero-wordmark span{
    color:#f5f8f9;
}


.hero-wordmark b{
    color:transparent;

    -webkit-text-stroke:
        2px
        rgba(235,249,252,.98);

    text-shadow:

        0 0 16px
        rgba(128,216,236,.22),

        0 0 42px
        rgba(128,216,236,.10),

        0 0 72px
        rgba(128,216,236,.05);

    animation:
        xPulse
        4.6s
        ease-in-out
        infinite;
}


@keyframes xPulse{

    0%,
    100%{
        filter:
            brightness(.95);
    }

    50%{
        filter:
            brightness(1.22);
    }

}


.hero-statement{
    max-width:890px;

    margin-top:38px;
}


.hero-label{
    display:block;

    margin-bottom:14px;

    color:#6f8c94;

    font-size:9px;

    font-weight:760;

    letter-spacing:.22em;
}


.hero-statement h2{
    margin:0;

    max-width:860px;

    font-size:
        clamp(
            38px,
            4.35vw,
            65px
        );

    line-height:.98;

    letter-spacing:-.055em;

    font-weight:510;
}


.hero-statement h2 em{
    display:block;

    margin-top:3px;

    color:#a3d7e2;

    font-style:normal;
}


.hero-statement p{
    max-width:760px;

    margin:
        24px
        0
        0;

    color:#a2afb4;

    font-size:17px;

    line-height:1.72;
}


.hero-actions{
    margin-top:30px;

    display:flex;

    gap:12px;
}


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

.btn{
    min-height:54px;

    padding:
        0
        24px;

    border:
        1px solid
        var(--line);

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:14px;

    font-size:13px;

    font-weight:760;

    letter-spacing:.02em;

    transition:
        transform .25s ease,
        background .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}


.btn-primary{
    color:#031013;

    background:
        linear-gradient(
            135deg,
            #eefafd,
            #bfeaf4
        );

    border-color:
        transparent;

    box-shadow:
        0 0 26px
        rgba(127,214,234,.10);
}


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

    box-shadow:
        0 0 34px
        rgba(127,214,234,.18);
}


.btn-ghost{
    background:
        rgba(
            255,
            255,
            255,
            .025
        );

    backdrop-filter:
        blur(12px);
}


.btn-ghost:hover{
    background:
        rgba(
            255,
            255,
            255,
            .06
        );

    border-color:
        var(--line-strong);
}


/* =========================================================
   HERO LASERS
   ========================================================= */

.hero-visual-field{
    position:absolute;

    inset:0;

    z-index:1;

    pointer-events:none;

    overflow:hidden;
}


.laser{
    position:absolute;

    height:1px;

    transform-origin:center;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(114,220,244,.03) 12%,
            rgba(146,231,248,.38) 42%,
            rgba(225,250,255,.88) 50%,
            rgba(146,231,248,.38) 58%,
            rgba(114,220,244,.03) 88%,
            transparent 100%
        );

    box-shadow:
        0 0 7px
        rgba(130,224,243,.28),

        0 0 18px
        rgba(130,224,243,.10);

    opacity:.34;
}


.laser-1{
    width:110vw;

    left:-24vw;

    top:31%;

    transform:
        rotate(-12deg);

    animation:
        laserFloat1
        10s
        ease-in-out
        infinite
        alternate;
}


.laser-2{
    width:95vw;

    right:-18vw;

    top:53%;

    transform:
        rotate(15deg);

    animation:
        laserFloat2
        13s
        ease-in-out
        infinite
        alternate;
}


.laser-3{
    width:82vw;

    right:-12vw;

    top:22%;

    transform:
        rotate(-27deg);

    opacity:.20;

    animation:
        laserFloat3
        16s
        ease-in-out
        infinite
        alternate;
}


.laser-4{
    width:70vw;

    left:-18vw;

    bottom:18%;

    transform:
        rotate(21deg);

    opacity:.20;

    animation:
        laserFloat4
        14s
        ease-in-out
        infinite
        alternate;
}


.laser-5{
    width:62vw;

    right:6vw;

    bottom:11%;

    transform:
        rotate(-7deg);

    opacity:.17;
}


.laser-6{
    width:58vw;

    left:18vw;

    top:13%;

    transform:
        rotate(4deg);

    opacity:.12;
}


@keyframes laserFloat1{

    from{
        transform:
            rotate(-12deg)
            translateY(-11px);
    }

    to{
        transform:
            rotate(-10deg)
            translateY(14px);
    }

}


@keyframes laserFloat2{

    from{
        transform:
            rotate(15deg)
            translateY(9px);
    }

    to{
        transform:
            rotate(17deg)
            translateY(-13px);
    }

}


@keyframes laserFloat3{

    from{
        transform:
            rotate(-27deg)
            translateY(0);
    }

    to{
        transform:
            rotate(-23deg)
            translateY(20px);
    }

}


@keyframes laserFloat4{

    from{
        transform:
            rotate(21deg)
            translateY(0);
    }

    to{
        transform:
            rotate(18deg)
            translateY(-18px);
    }

}


/* =========================================================
   HERO LASER PULSES
   ========================================================= */

.laser-pulse{
    position:absolute;

    width:170px;

    height:2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #e7fbff,
            transparent
        );

    box-shadow:

        0 0 10px
        rgba(141,229,247,.85),

        0 0 28px
        rgba(141,229,247,.30);

    opacity:0;
}


.laser-pulse-1{
    top:31%;

    left:-190px;

    transform:
        rotate(-12deg);

    animation:
        laserTravel1
        5.4s
        linear
        infinite;
}


.laser-pulse-2{
    top:53%;

    right:-190px;

    transform:
        rotate(15deg);

    animation:
        laserTravel2
        6.7s
        linear
        infinite
        1.2s;
}


.laser-pulse-3{
    top:22%;

    right:-190px;

    transform:
        rotate(-27deg);

    animation:
        laserTravel3
        8.2s
        linear
        infinite
        2.1s;
}


@keyframes laserTravel1{

    0%{
        left:-190px;
        opacity:0;
    }

    10%{
        opacity:.75;
    }

    90%{
        opacity:.55;
    }

    100%{
        left:105vw;
        opacity:0;
    }

}


@keyframes laserTravel2{

    0%{
        right:-190px;
        opacity:0;
    }

    10%{
        opacity:.65;
    }

    90%{
        opacity:.45;
    }

    100%{
        right:105vw;
        opacity:0;
    }

}


@keyframes laserTravel3{

    0%{
        right:-190px;
        opacity:0;
    }

    10%{
        opacity:.45;
    }

    90%{
        opacity:.35;
    }

    100%{
        right:105vw;
        opacity:0;
    }

}


/* =========================================================
   HERO CIRCUITS
   ========================================================= */

.hero-circuit-svg{
    position:absolute;

    inset:0;

    width:100%;

    height:100%;

    opacity:.78;

    overflow:visible;
}


.circuit-base{
    fill:none;

    stroke:
        url(#circuitStroke);

    stroke-width:1;

    vector-effect:
        non-scaling-stroke;
}


.circuit-pulse{
    fill:none;

    stroke:#c8f5ff;

    stroke-width:1.6;

    vector-effect:
        non-scaling-stroke;

    stroke-dasharray:
        30
        280;

    filter:
        url(#circuitGlow);
}


.circuit-pulse-a{
    animation:
        circuitDash
        7s
        linear
        infinite;
}


.circuit-pulse-b{
    animation:
        circuitDash
        9s
        linear
        infinite
        reverse;
}


.circuit-pulse-c{
    animation:
        circuitDash
        11s
        linear
        infinite
        1.2s;
}


@keyframes circuitDash{

    to{
        stroke-dashoffset:-620;
    }

}


.circuit-nodes circle{
    fill:#d8f9ff;

    opacity:.55;

    filter:
        url(#circuitGlow);

    animation:
        nodeBlink
        3.4s
        ease-in-out
        infinite;
}


.circuit-nodes circle:nth-child(2n){
    animation-delay:1.1s;
}


.circuit-nodes circle:nth-child(3n){
    animation-delay:2.2s;
}


@keyframes nodeBlink{

    0%,
    100%{
        opacity:.18;
    }

    50%{
        opacity:.8;
    }

}


/* =========================================================
   HERO ORBIT SYSTEM
   ========================================================= */

.orbit-system{
    position:absolute;

    right:-110px;

    top:50%;

    width:620px;

    height:620px;

    transform:
        translateY(-50%);

    opacity:.72;

    transition:
        transform .2s ease-out;
}


.orbit{
    position:absolute;

    border-radius:50%;

    border:
        1px solid
        rgba(150,228,245,.10);
}


.orbit-1{
    inset:0;

    animation:
        orbitSpin
        32s
        linear
        infinite;
}


.orbit-2{
    inset:72px;

    border-style:dashed;

    animation:
        orbitSpinReverse
        25s
        linear
        infinite;
}


.orbit-3{
    inset:150px;

    border-color:
        rgba(151,228,245,.15);

    animation:
        orbitSpin
        19s
        linear
        infinite;
}


.orbit-4{
    inset:227px;

    border-color:
        rgba(196,241,251,.24);
}


.orbit-core{
    position:absolute;

    left:50%;

    top:50%;

    width:18px;

    height:18px;

    transform:
        translate(-50%,-50%)
        rotate(45deg);

    border:
        1px solid
        rgba(232,251,255,.9);

    background:
        rgba(151,226,243,.08);

    box-shadow:

        0 0 18px
        rgba(124,218,238,.75),

        0 0 55px
        rgba(124,218,238,.24);
}


.orbit-dot{
    position:absolute;

    width:6px;

    height:6px;

    border-radius:50%;

    background:#e2fbff;

    box-shadow:
        0 0 15px
        rgba(117,218,240,.9);
}


.orbit-dot-1{
    right:64px;
    top:114px;
}


.orbit-dot-2{
    left:97px;
    bottom:104px;
}


.orbit-dot-3{
    right:168px;
    bottom:34px;
}


.orbit-dot-4{
    left:178px;
    top:34px;
}


@keyframes orbitSpin{

    to{
        transform:
            rotate(360deg);
    }

}


@keyframes orbitSpinReverse{

    to{
        transform:
            rotate(-360deg);
    }

}


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

.hero-grid-plane{
    position:absolute;

    left:0;

    right:0;

    bottom:-30%;

    height:55%;

    opacity:.20;

    background-image:

        linear-gradient(
            rgba(128,214,233,.08) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(128,214,233,.08) 1px,
            transparent 1px
        );

    background-size:
        70px
        70px;

    transform:
        perspective(720px)
        rotateX(68deg)
        scale(1.5);

    transform-origin:
        center
        bottom;

    mask-image:
        linear-gradient(
            to top,
            #000,
            transparent 90%
        );
}


.hero-bottom-line{
    position:absolute;

    left:0;

    right:0;

    bottom:0;

    height:1px;

    background:
        rgba(158,229,245,.11);

    overflow:hidden;
}


.hero-bottom-line span{
    position:absolute;

    top:0;

    left:-22%;

    width:22%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #c7f4fd,
            transparent
        );

    box-shadow:
        0 0 7px
        rgba(132,221,240,.8);

    animation:
        bottomScan
        4.2s
        linear
        infinite;
}


@keyframes bottomScan{

    to{
        left:100%;
    }

}


/* =========================================================
   GLOBAL SECTION TYPOGRAPHY
   ========================================================= */

.section-heading{
    display:grid;

    grid-template-columns:
        220px
        1fr;

    gap:55px;

    align-items:start;
}


.section-code{
    color:#70858c;

    font-size:10px;

    font-weight:760;

    letter-spacing:.23em;
}


.section-pretitle{
    display:block;

    margin-bottom:18px;

    color:#66828a;

    font-size:9px;

    font-weight:760;

    letter-spacing:.22em;
}


.section-heading h2{
    margin:0;

    max-width:1080px;

    font-size:
        clamp(
            48px,
            6vw,
            88px
        );

    line-height:.97;

    letter-spacing:-.06em;

    font-weight:500;
}


.section-heading h2 em{
    display:block;

    color:#87bccc;

    font-style:normal;
}


.section-heading p{
    max-width:760px;

    margin:
        32px
        0
        0;

    color:#96a4aa;

    font-size:17px;

    line-height:1.75;
}


/* =========================================================
   SYSTEM — HUMAN + AI
   ========================================================= */

.system-evolution{
    position:relative;

    overflow:hidden;

    padding:
        155px
        0
        145px;

    background:

        radial-gradient(
            circle at 50% 52%,
            rgba(72,174,197,.07),
            transparent 23%
        ),

        linear-gradient(
            180deg,
            rgba(2,5,6,.98),
            rgba(2,6,8,.98)
        );

    border-bottom:
        1px solid
        var(--line);
}


.section-atmosphere{
    position:absolute;

    inset:0;

    overflow:hidden;

    pointer-events:none;
}


.section-atmosphere::before{
    content:"";

    position:absolute;

    inset:0;

    opacity:.20;

    background-image:

        linear-gradient(
            rgba(121,208,228,.035) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(121,208,228,.035) 1px,
            transparent 1px
        );

    background-size:
        78px
        78px;

    mask-image:
        radial-gradient(
            circle at 50% 55%,
            #000 5%,
            transparent 72%
        );
}


.section-laser{
    position:absolute;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(151,230,247,.32),
            transparent
        );

    box-shadow:
        0 0 12px
        rgba(129,218,238,.13);
}


.system-laser-a{
    width:68vw;

    left:-20vw;

    top:43%;

    transform:
        rotate(13deg);

    animation:
        systemLaserA
        13s
        ease-in-out
        infinite
        alternate;
}


.system-laser-b{
    width:69vw;

    right:-22vw;

    top:50%;

    transform:
        rotate(-12deg);

    animation:
        systemLaserB
        14s
        ease-in-out
        infinite
        alternate;
}


.system-laser-c{
    width:48vw;

    left:27vw;

    bottom:12%;

    opacity:.25;

    transform:
        rotate(2deg);
}


@keyframes systemLaserA{

    from{
        transform:
            rotate(13deg)
            translateY(-8px);
    }

    to{
        transform:
            rotate(15deg)
            translateY(16px);
    }

}


@keyframes systemLaserB{

    from{
        transform:
            rotate(-12deg)
            translateY(10px);
    }

    to{
        transform:
            rotate(-15deg)
            translateY(-14px);
    }

}


.system-energy-core{
    position:absolute;

    width:720px;

    height:720px;

    left:50%;

    top:61%;

    transform:
        translate(-50%,-50%);

    border-radius:50%;

    background:
        rgba(
            86,
            194,
            219,
            .06
        );

    filter:
        blur(120px);
}


/* =========================================================
   SYSTEM CIRCUIT FIELD
   ========================================================= */

.system-circuit-field{
    position:absolute;

    inset:0;

    width:100%;

    height:100%;

    opacity:.78;
}


.system-path{
    fill:none;

    stroke:
        url(#systemCircuitGradient);

    stroke-width:1;

    vector-effect:
        non-scaling-stroke;
}


.system-path-pulse{
    fill:none;

    stroke:#cbf7ff;

    stroke-width:1.6;

    vector-effect:
        non-scaling-stroke;

    stroke-dasharray:
        30
        270;

    filter:
        drop-shadow(
            0
            0
            4px
            rgba(116,220,242,.75)
        );
}


.system-path-pulse-a{
    animation:
        systemCircuitFlow
        8s
        linear
        infinite;
}


.system-path-pulse-b{
    animation:
        systemCircuitFlow
        9.5s
        linear
        infinite
        reverse;
}


@keyframes systemCircuitFlow{

    to{
        stroke-dashoffset:-640;
    }

}


/* =========================================================
   HUMAN VS AI TEXT
   ========================================================= */

.strike-word{
    position:relative;

    display:inline-block;

    color:#69777d;
}


.strike-word::after{
    content:"";

    position:absolute;

    left:-2%;

    right:-2%;

    top:54%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(148,224,241,.62),
            transparent
        );

    box-shadow:
        0 0 8px
        rgba(125,216,237,.22);
}


/* =========================================================
   INTELLIGENCE ARCHITECTURE
   ========================================================= */

.intelligence-architecture{
    position:relative;

    z-index:3;

    margin-top:115px;

    display:grid;

    grid-template-columns:
        1fr
        minmax(80px,.38fr)
        1.16fr
        minmax(80px,.38fr)
        1fr;

    align-items:center;
}


.architecture-stage{
    position:relative;

    min-height:490px;

    padding:
        24px
        18px
        26px;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:
        space-between;

    text-align:center;
}


.architecture-stage::before{
    content:"";

    position:absolute;

    inset:0;

    border-top:
        1px solid
        rgba(188,238,249,.10);

    border-bottom:
        1px solid
        rgba(188,238,249,.07);

    mask-image:
        linear-gradient(
            90deg,
            transparent,
            #000 20%,
            #000 80%,
            transparent
        );
}


.astorre-stage{
    min-height:570px;
}


.architecture-index{
    width:100%;

    color:#65787f;

    font-size:9px;

    letter-spacing:.18em;
}


.architecture-visual{
    position:relative;

    width:100%;

    height:290px;

    display:grid;

    place-items:center;
}


.architecture-label{
    color:#79a5b0;

    font-size:9px;

    font-weight:760;

    letter-spacing:.19em;
}


.architecture-copy{
    min-height:130px;
}


.architecture-copy h3{
    margin:
        12px
        0
        0;

    color:#eef5f7;

    font-size:27px;

    line-height:1.12;

    letter-spacing:-.045em;

    font-weight:520;
}


.astorre-stage
.architecture-copy
h3{
    font-size:32px;
}


.architecture-copy p{
    margin:
        13px
        0
        0;

    color:#708087;

    font-size:11px;

    line-height:1.6;

    letter-spacing:.07em;
}


/* =========================================================
   HUMAN NODE
   ========================================================= */

.human-intelligence{
    width:270px;

    height:270px;
}


.human-orbit{
    position:absolute;

    border-radius:50%;

    border:
        1px solid
        rgba(143,220,238,.14);
}


.human-orbit-a{
    inset:14px;

    animation:
        humanOrbit
        30s
        linear
        infinite;
}


.human-orbit-b{
    inset:52px;

    border-style:dashed;

    opacity:.72;

    animation:
        humanOrbitReverse
        22s
        linear
        infinite;
}


.human-orbit-c{
    inset:91px;

    border-color:
        rgba(198,242,251,.24);
}


.human-core{
    position:absolute;

    left:50%;

    top:50%;

    width:15px;

    height:15px;

    transform:
        translate(-50%,-50%);

    border-radius:50%;

    background:#e2fbff;

    box-shadow:

        0 0 18px
        rgba(127,218,239,.9),

        0 0 60px
        rgba(127,218,239,.28);
}


.human-signal{
    position:absolute;

    left:50%;

    top:50%;

    width:123px;

    height:1px;

    transform-origin:
        left center;

    background:
        linear-gradient(
            90deg,
            rgba(164,232,247,.58),
            transparent
        );
}


.human-signal-a{
    transform:
        rotate(12deg);
}


.human-signal-b{
    transform:
        rotate(102deg);
}


.human-signal-c{
    transform:
        rotate(192deg);
}


.human-signal-d{
    transform:
        rotate(282deg);
}


@keyframes humanOrbit{

    to{
        transform:
            rotate(360deg);
    }

}


@keyframes humanOrbitReverse{

    to{
        transform:
            rotate(-360deg);
    }

}


/* =========================================================
   ASTORRE X CORE
   ========================================================= */

.astorre-intelligence{
    height:360px;
}


.astorre-core-system{
    position:relative;

    width:280px;

    height:280px;

    display:grid;

    place-items:center;
}


.astorre-ring{
    position:absolute;

    border-radius:50%;

    border:
        1px solid
        rgba(161,231,247,.17);
}


.astorre-ring-a{
    inset:0;

    animation:
        astorreSpin
        28s
        linear
        infinite;
}


.astorre-ring-b{
    inset:37px;

    border-style:dashed;

    animation:
        astorreSpinReverse
        20s
        linear
        infinite;
}


.astorre-ring-c{
    inset:78px;

    border-color:
        rgba(208,247,255,.31);

    animation:
        astorrePulseRing
        5s
        ease-in-out
        infinite;
}


.astorre-ring-d{
    inset:108px;

    border-color:
        rgba(215,248,255,.42);
}


.astorre-axis{
    position:absolute;

    left:50%;

    top:50%;

    width:390px;

    height:1px;

    transform-origin:center;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(151,230,247,.30),
            transparent
        );
}


.astorre-axis-a{
    transform:
        translate(-50%,-50%)
        rotate(27deg);
}


.astorre-axis-b{
    transform:
        translate(-50%,-50%)
        rotate(117deg);
}


.astorre-core-system b{
    position:relative;

    z-index:4;

    color:#e5fbff;

    font-size:74px;

    font-weight:420;

    line-height:1;

    text-shadow:

        0 0 12px
        rgba(128,221,241,.7),

        0 0 36px
        rgba(128,221,241,.25),

        0 0 70px
        rgba(128,221,241,.11);

    animation:
        astorreXGlow
        4s
        ease-in-out
        infinite;
}


.astorre-wave{
    position:absolute;

    left:50%;

    top:50%;

    width:80px;

    height:80px;

    border:
        1px solid
        rgba(151,231,248,.17);

    border-radius:50%;

    transform:
        translate(-50%,-50%);

    animation:
        astorreWave
        5s
        linear
        infinite;
}


.astorre-wave-b{
    animation-delay:
        1.65s;
}


.astorre-wave-c{
    animation-delay:
        3.3s;
}


@keyframes astorreSpin{

    to{
        transform:
            rotate(360deg);
    }

}


@keyframes astorreSpinReverse{

    to{
        transform:
            rotate(-360deg);
    }

}


@keyframes astorrePulseRing{

    0%,
    100%{
        transform:
            scale(.97);

        opacity:.55;
    }

    50%{
        transform:
            scale(1.04);

        opacity:1;
    }

}


@keyframes astorreXGlow{

    0%,
    100%{
        filter:
            brightness(.92);

        transform:
            scale(.98);
    }

    50%{
        filter:
            brightness(1.2);

        transform:
            scale(1.035);
    }

}


@keyframes astorreWave{

    0%{
        width:70px;

        height:70px;

        opacity:.85;
    }

    80%{
        opacity:.08;
    }

    100%{
        width:370px;

        height:370px;

        opacity:0;
    }

}


/* =========================================================
   ACTION NODE
   ========================================================= */

.action-intelligence{
    width:270px;

    height:270px;
}


.action-core-v2{
    position:absolute;

    left:50%;

    top:50%;

    width:84px;

    height:84px;

    transform:
        translate(-50%,-50%)
        rotate(45deg);

    display:grid;

    place-items:center;

    border:
        1px solid
        rgba(191,239,249,.28);

    box-shadow:

        0 0 28px
        rgba(102,208,231,.14),

        inset 0 0 24px
        rgba(102,208,231,.06);
}


.action-core-v2 span{
    width:12px;

    height:12px;

    background:#e4fbff;

    box-shadow:
        0 0 18px
        rgba(129,222,241,.85);

    animation:
        actionCorePulse
        2.8s
        ease-in-out
        infinite;
}


.action-beam{
    position:absolute;

    left:50%;

    top:50%;

    width:145px;

    height:1px;

    transform-origin:
        left center;

    background:
        linear-gradient(
            90deg,
            rgba(172,234,247,.60),
            transparent
        );
}


.action-beam-a{
    transform:
        rotate(0deg);
}


.action-beam-b{
    transform:
        rotate(60deg);
}


.action-beam-c{
    transform:
        rotate(120deg);
}


.action-beam-d{
    transform:
        rotate(180deg);
}


.action-beam-e{
    transform:
        rotate(240deg);
}


.action-beam-f{
    transform:
        rotate(300deg);
}


@keyframes actionCorePulse{

    0%,
    100%{
        opacity:.55;

        transform:
            scale(.85);
    }

    50%{
        opacity:1;

        transform:
            scale(1.15);
    }

}


/* =========================================================
   HUMAN → AI → ACTION BRIDGES
   ========================================================= */

.architecture-bridge{
    position:relative;

    height:160px;

    display:flex;

    align-items:center;

    justify-content:center;
}


.bridge-track{
    position:absolute;

    left:0;

    right:0;

    top:50%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            rgba(104,197,218,.08),
            rgba(157,230,246,.50),
            rgba(104,197,218,.08)
        );

    box-shadow:
        0 0 8px
        rgba(117,214,236,.12);
}


.bridge-energy{
    position:absolute;

    top:50%;

    left:-35%;

    width:36%;

    height:2px;

    margin-top:-1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #e2fbff,
            transparent
        );

    box-shadow:

        0 0 10px
        rgba(130,223,243,.88),

        0 0 24px
        rgba(130,223,243,.28);

    animation:
        bridgeFlow
        2.7s
        linear
        infinite;
}


.bridge-ai-action
.bridge-energy{
    animation-delay:
        1.2s;
}


.bridge-node{
    position:absolute;

    top:50%;

    width:5px;

    height:5px;

    margin-top:-2px;

    border-radius:50%;

    background:#c9f5fd;

    box-shadow:
        0 0 11px
        rgba(127,219,240,.8);
}


.bridge-node-a{
    left:24%;
}


.bridge-node-b{
    right:20%;
}


.architecture-bridge small{
    position:absolute;

    top:
        calc(
            50% + 18px
        );

    color:#52676e;

    font-size:8px;

    letter-spacing:.18em;
}


@keyframes bridgeFlow{

    to{
        left:100%;
    }

}


/* =========================================================
   THE RULE
   ========================================================= */

.human-command-statement{
    position:relative;

    z-index:4;

    margin-top:95px;

    padding-top:30px;

    border-top:
        1px solid
        var(--line);

    display:grid;

    grid-template-columns:
        220px
        1fr;

    gap:55px;
}


.human-command-statement > span{
    color:#657980;

    font-size:9px;

    letter-spacing:.20em;
}


.human-command-statement h3{
    max-width:920px;

    margin:0;

    color:#e7eef0;

    font-size:
        clamp(
            28px,
            3vw,
            43px
        );

    line-height:1.14;

    letter-spacing:-.04em;

    font-weight:500;
}


.human-command-statement p{
    max-width:790px;

    margin:
        24px
        0
        0;

    color:#8e9ca2;

    font-size:16px;

    line-height:1.72;
}


/* =========================================================
   PRODUCTS FUTURE
   ========================================================= */

.products-future{
    position:relative;

    padding:
        150px
        0;

    overflow:hidden;

    background:

        radial-gradient(
            circle at 50% 40%,
            rgba(65,145,162,.055),
            transparent 35%
        ),

        rgba(
            1,
            4,
            5,
            .97
        );

    border-bottom:
        1px solid
        var(--line);
}


.products-atmosphere{
    position:absolute;

    inset:0;

    pointer-events:none;

    overflow:hidden;
}


.products-laser{
    position:absolute;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(144,227,245,.26),
            transparent
        );

    box-shadow:
        0 0 10px
        rgba(127,217,238,.11);
}


.products-laser-a{
    width:70vw;

    left:-20vw;

    top:45%;

    transform:
        rotate(-10deg);

    animation:
        productLaserA
        15s
        ease-in-out
        infinite
        alternate;
}


.products-laser-b{
    width:64vw;

    right:-16vw;

    top:62%;

    transform:
        rotate(12deg);

    animation:
        productLaserB
        14s
        ease-in-out
        infinite
        alternate;
}


@keyframes productLaserA{

    from{
        transform:
            rotate(-10deg)
            translateY(-9px);
    }

    to{
        transform:
            rotate(-12deg)
            translateY(15px);
    }

}


@keyframes productLaserB{

    from{
        transform:
            rotate(12deg)
            translateY(10px);
    }

    to{
        transform:
            rotate(15deg)
            translateY(-15px);
    }

}


.products-orbit{
    position:absolute;

    width:720px;

    height:720px;

    right:-280px;

    top:50%;

    transform:
        translateY(-50%);

    border:
        1px solid
        rgba(143,222,240,.055);

    border-radius:50%;

    box-shadow:
        inset
        0
        0
        100px
        rgba(96,190,212,.025);
}


/* =========================================================
   PRODUCT SYSTEM GRID
   ========================================================= */

.product-systems{
    position:relative;

    z-index:3;

    margin-top:88px;

    display:grid;

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

    border-top:
        1px solid
        var(--line);

    border-left:
        1px solid
        var(--line);
}


.product-system{
    position:relative;

    min-height:625px;

    padding:28px;

    overflow:hidden;

    display:flex;

    flex-direction:column;

    justify-content:
        space-between;

    border-right:
        1px solid
        var(--line);

    border-bottom:
        1px solid
        var(--line);

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.025),
            rgba(255,255,255,.006)
        );

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


.product-system::before{
    content:"";

    position:absolute;

    inset:0;

    opacity:0;

    background:
        radial-gradient(
            circle at 50% 43%,
            rgba(101,206,230,.10),
            transparent 31%
        );

    transition:
        opacity .35s ease;
}


.product-system:hover{
    transform:
        translateY(-6px);

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

    box-shadow:
        0
        28px
        70px
        rgba(0,0,0,.22);
}


.product-system:hover::before{
    opacity:1;
}


.product-system-head{
    position:relative;

    z-index:3;

    display:flex;

    align-items:center;

    justify-content:
        space-between;

    color:#89979d;

    font-size:10px;

    letter-spacing:.18em;
}


.product-status{
    display:flex;

    align-items:center;

    gap:8px;

    color:#87b7c4;

    font-size:8px;

    font-weight:760;

    letter-spacing:.16em;
}


.product-status i{
    width:5px;

    height:5px;

    border-radius:50%;

    background:#8ce3f4;

    box-shadow:
        0
        0
        10px
        #8ce3f4;
}


.product-status.development{
    color:#737f84;
}


.product-status.development i{
    background:#66757b;

    box-shadow:none;
}


.product-system-visual{
    position:relative;

    z-index:2;

    height:290px;

    display:flex;

    align-items:center;

    justify-content:center;
}


.product-system-copy{
    position:relative;

    z-index:3;
}


.product-system-copy h3{
    margin:
        11px
        0
        0;

    color:#f0f5f7;

    font-size:37px;

    letter-spacing:-.045em;

    font-weight:520;
}


.product-system-copy p{
    max-width:390px;

    margin:
        18px
        0
        0;

    color:#8f9ca1;

    font-size:15px;

    line-height:1.72;
}


.product-system-copy strong{
    display:inline-block;

    margin-top:30px;

    color:#bdebf5;

    font-size:10px;

    letter-spacing:.17em;
}


/* =========================================================
   TEXT PRODUCT VISUAL
   ========================================================= */

.text-intelligence-visual{
    flex-direction:column;

    gap:16px;
}


.text-data{
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(151,230,247,.82),
            transparent
        );

    box-shadow:
        0 0 10px
        rgba(128,221,241,.22);

    animation:
        textDataPulse
        3.5s
        ease-in-out
        infinite;
}


.text-data-a{
    width:25%;
}


.text-data-b{
    width:58%;

    animation-delay:.4s;
}


.text-data-c{
    width:42%;

    animation-delay:.8s;
}


.text-data-d{
    width:68%;

    animation-delay:1.2s;
}


.text-data-e{
    width:33%;

    animation-delay:1.6s;
}


.text-scan{
    position:absolute;

    left:10%;

    right:10%;

    top:10%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(221,250,255,.75),
            transparent
        );

    box-shadow:
        0 0 10px
        rgba(127,219,240,.5);

    animation:
        textScan
        4.5s
        ease-in-out
        infinite;
}


@keyframes textDataPulse{

    0%,
    100%{
        opacity:.28;
    }

    50%{
        opacity:1;
    }

}


@keyframes textScan{

    0%{
        top:15%;

        opacity:0;
    }

    12%{
        opacity:.7;
    }

    88%{
        opacity:.45;
    }

    100%{
        top:88%;

        opacity:0;
    }

}


/* =========================================================
   VOICE PRODUCT VISUAL
   ========================================================= */

.voice-intelligence-visual{
    position:relative;
}


.voice-ring{
    position:absolute;

    width:220px;

    height:220px;

    border:
        1px solid
        rgba(145,225,243,.12);

    border-radius:50%;

    animation:
        voiceRingPulse
        4s
        ease-in-out
        infinite;
}


.voice-ring::before{
    content:"";

    position:absolute;

    inset:32px;

    border:
        1px dashed
        rgba(145,225,243,.12);

    border-radius:50%;

    animation:
        orbitSpin
        18s
        linear
        infinite;
}


.voice-wave{
    position:relative;

    z-index:2;

    display:flex;

    align-items:center;

    gap:7px;
}


.voice-wave i{
    display:block;

    width:2px;

    border-radius:10px;

    background:#b7edf8;

    box-shadow:
        0 0 10px
        rgba(124,219,240,.28);

    animation:
        voiceWave
        1.8s
        ease-in-out
        infinite;
}


.voice-wave i:nth-child(odd){
    height:34px;

    animation-delay:.1s;
}


.voice-wave i:nth-child(2n){
    height:85px;

    animation-delay:.25s;
}


.voice-wave i:nth-child(3n){
    height:135px;

    animation-delay:.4s;
}


.voice-wave i:nth-child(5n){
    height:180px;

    animation-delay:.55s;
}


.voice-wave i:nth-child(7n){
    height:112px;

    animation-delay:.7s;
}


@keyframes voiceWave{

    0%,
    100%{
        transform:
            scaleY(.45);

        opacity:.28;
    }

    50%{
        transform:
            scaleY(1);

        opacity:1;
    }

}


@keyframes voiceRingPulse{

    0%,
    100%{
        transform:
            scale(.97);

        opacity:.45;
    }

    50%{
        transform:
            scale(1.04);

        opacity:.9;
    }

}


/* =========================================================
   WORKER PRODUCT VISUAL
   ========================================================= */

.worker-intelligence-visual{
    position:relative;
}


.worker-core-v2{
    position:relative;

    z-index:3;

    width:105px;

    height:105px;

    display:grid;

    place-items:center;

    transform:
        rotate(45deg);

    border:
        1px solid
        rgba(164,231,247,.34);

    box-shadow:

        0 0 36px
        rgba(117,214,235,.13),

        inset
        0
        0
        25px
        rgba(117,214,235,.06);
}


.worker-core-v2 b{
    transform:
        rotate(-45deg);

    color:#dff9ff;

    font-size:37px;

    font-weight:430;

    text-shadow:
        0
        0
        14px
        rgba(130,222,241,.6);
}


.worker-orbit{
    position:absolute;

    border-radius:50%;

    border:
        1px solid
        rgba(151,228,245,.12);
}


.worker-orbit-a{
    width:230px;

    height:230px;

    animation:
        orbitSpin
        24s
        linear
        infinite;
}


.worker-orbit-b{
    width:175px;

    height:175px;

    border-style:dashed;

    animation:
        orbitSpinReverse
        17s
        linear
        infinite;
}


.worker-beam{
    position:absolute;

    width:140px;

    height:1px;

    background:
        linear-gradient(
            90deg,
            rgba(142,222,241,.58),
            transparent
        );

    transform-origin:
        left center;
}


.worker-beam-a{
    transform:
        rotate(0deg);
}


.worker-beam-b{
    transform:
        rotate(90deg);
}


.worker-beam-c{
    transform:
        rotate(180deg);
}


.worker-beam-d{
    transform:
        rotate(270deg);
}


/* =========================================================
   TRANSITION SECTION
   ========================================================= */

.transition-section{
    position:relative;

    overflow:hidden;

    padding:
        155px
        0;

    background:
        linear-gradient(
            180deg,
            #020506,
            #010304
        );

    border-bottom:
        1px solid
        var(--line);
}


.transition-field{
    position:absolute;

    inset:0;

    pointer-events:none;
}


.transition-field::before{
    content:"";

    position:absolute;

    inset:0;

    opacity:.20;

    background-image:

        linear-gradient(
            rgba(121,208,228,.035) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(121,208,228,.035) 1px,
            transparent 1px
        );

    background-size:
        86px
        86px;

    mask-image:
        radial-gradient(
            circle at 76% 48%,
            #000,
            transparent 60%
        );
}


.transition-ray{
    position:absolute;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(157,232,247,.27),
            transparent
        );

    box-shadow:
        0 0 9px
        rgba(127,218,239,.12);
}


.transition-ray-a{
    width:75vw;

    left:-22vw;

    top:32%;

    transform:
        rotate(-11deg);
}


.transition-ray-b{
    width:70vw;

    right:-16vw;

    top:55%;

    transform:
        rotate(14deg);
}


.transition-ray-c{
    width:58vw;

    right:10vw;

    bottom:12%;

    transform:
        rotate(-5deg);

    opacity:.3;
}


.transition-core{
    position:absolute;

    right:-120px;

    top:50%;

    width:610px;

    height:610px;

    transform:
        translateY(-50%);

    border:
        1px solid
        rgba(148,225,242,.08);

    border-radius:50%;
}


.transition-core span{
    position:absolute;

    border:
        1px solid
        rgba(148,225,242,.07);

    border-radius:50%;
}


.transition-core span:nth-child(1){
    inset:70px;
}


.transition-core span:nth-child(2){
    inset:150px;
}


.transition-core span:nth-child(3){
    inset:235px;
}


.transition-core i{
    position:absolute;

    left:50%;

    top:50%;

    width:9px;

    height:9px;

    transform:
        translate(-50%,-50%);

    border-radius:50%;

    background:#dff9ff;

    box-shadow:
        0
        0
        26px
        rgba(129,221,241,.88);
}


.transition-shell{
    position:relative;

    z-index:3;

    display:grid;

    grid-template-columns:
        220px
        1fr;

    gap:55px;
}


.transition-content{
    max-width:1080px;
}


.transition-content h2{
    max-width:1040px;

    margin:0;

    font-size:
        clamp(
            52px,
            6.5vw,
            97px
        );

    line-height:.95;

    letter-spacing:-.064em;

    font-weight:500;
}


.transition-copy-grid{
    margin-top:48px;

    max-width:900px;

    display:grid;

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

    gap:50px;
}


.transition-copy-grid p{
    margin:0;

    color:#8e9da3;

    font-size:17px;

    line-height:1.75;
}


.transition-line{
    margin-top:85px;

    display:grid;

    grid-template-columns:
        auto
        1fr
        auto
        1fr
        auto
        1fr
        auto
        1fr
        auto;

    gap:18px;

    align-items:center;
}


.transition-line span{
    color:#5f7279;

    font-size:9px;

    letter-spacing:.18em;
}


.transition-line strong{
    color:#e0ecef;

    font-size:14px;

    letter-spacing:.11em;

    font-weight:620;
}


.transition-line .transition-plus{
    color:#76bfd0;

    font-size:21px;
}


.transition-line .transition-ai{
    color:#b7eaf4;
}


.transition-line i{
    height:1px;

    background:
        linear-gradient(
            90deg,
            rgba(112,204,224,.08),
            rgba(151,229,245,.42),
            rgba(112,204,224,.08)
        );
}


/* =========================================================
   MANIFESTO
   ========================================================= */

.manifesto-future{
    position:relative;

    overflow:hidden;

    padding:
        155px
        0;

    background:

        radial-gradient(
            circle at 75% 45%,
            rgba(62,148,168,.055),
            transparent 25%
        ),

        linear-gradient(
            180deg,
            rgba(2,5,6,.98),
            rgba(2,6,7,.98)
        );

    border-bottom:
        1px solid
        var(--line);
}


.manifesto-circuit-field{
    position:absolute;

    inset:0;

    pointer-events:none;
}


.manifesto-line{
    position:absolute;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(148,228,245,.24),
            transparent
        );
}


.manifesto-line-a{
    width:68vw;

    right:-15vw;

    top:27%;

    transform:
        rotate(-15deg);
}


.manifesto-line-b{
    width:58vw;

    left:-18vw;

    top:63%;

    transform:
        rotate(12deg);
}


.manifesto-line-c{
    width:42vw;

    right:10vw;

    bottom:8%;

    transform:
        rotate(-4deg);

    opacity:.3;
}


.manifesto-shell{
    position:relative;

    z-index:3;

    display:grid;

    grid-template-columns:
        220px
        1fr;

    gap:55px;
}


.manifesto-main{
    max-width:1100px;
}


.manifesto-main h2{
    margin:0;

    font-size:
        clamp(
            50px,
            7vw,
            104px
        );

    line-height:.94;

    letter-spacing:-.065em;

    font-weight:500;
}


.manifesto-lead{
    max-width:850px;

    margin:
        45px
        0
        0;

    color:#91a0a6;

    font-size:21px;

    line-height:1.6;
}


.manifesto-lead strong{
    display:block;

    margin-top:18px;

    color:#c8e6ed;

    font-weight:500;
}


.principles-grid{
    grid-column:2;

    margin-top:95px;

    display:grid;

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

    border-top:
        1px solid
        var(--line);
}


.principles-grid article{
    position:relative;

    min-height:280px;

    padding:
        30px
        30px
        32px
        0;

    border-right:
        1px solid
        var(--line);
}


.principles-grid article + article{
    padding-left:30px;
}


.principles-grid article:last-child{
    border-right:0;
}


.principles-grid article::before{
    content:"";

    position:absolute;

    left:0;

    top:0;

    width:0;

    height:1px;

    background:
        var(--cold-2);

    box-shadow:
        0
        0
        9px
        rgba(126,219,239,.5);

    transition:
        width .35s ease;
}


.principles-grid article:hover::before{
    width:100%;
}


.principles-grid span{
    color:#63757c;

    font-size:9px;

    letter-spacing:.18em;
}


.principles-grid h3{
    margin:
        52px
        0
        0;

    font-size:27px;

    font-weight:530;

    letter-spacing:-.038em;
}


.principles-grid p{
    margin:
        17px
        0
        0;

    color:#829096;

    font-size:14px;

    line-height:1.72;
}


/* =========================================================
   FINAL FUTURE
   ========================================================= */

.final-future{
    position:relative;

    overflow:hidden;

    min-height:82vh;

    padding:
        155px
        0;

    display:flex;

    align-items:center;

    background:

        radial-gradient(
            circle at 72% 48%,
            rgba(84,179,201,.07),
            transparent 22%
        ),

        rgba(
            1,
            4,
            5,
            .98
        );
}


.final-field{
    position:absolute;

    inset:0;

    pointer-events:none;

    overflow:hidden;
}


.final-laser{
    position:absolute;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(149,229,245,.31),
            transparent
        );

    box-shadow:
        0
        0
        10px
        rgba(128,219,239,.14);
}


.final-laser-a{
    width:75vw;

    left:-20vw;

    top:38%;

    transform:
        rotate(-10deg);
}


.final-laser-b{
    width:70vw;

    right:-18vw;

    top:54%;

    transform:
        rotate(14deg);
}


.final-laser-c{
    width:50vw;

    right:7vw;

    bottom:12%;

    transform:
        rotate(-5deg);

    opacity:.27;
}


.final-core{
    position:absolute;

    right:-100px;

    top:50%;

    width:590px;

    height:590px;

    transform:
        translateY(-50%);

    display:grid;

    place-items:center;
}


.final-ring{
    position:absolute;

    border-radius:50%;

    border:
        1px solid
        rgba(147,227,244,.09);
}


.final-ring-a{
    inset:0;

    animation:
        orbitSpin
        30s
        linear
        infinite;
}


.final-ring-b{
    inset:85px;

    border-style:dashed;

    animation:
        orbitSpinReverse
        22s
        linear
        infinite;
}


.final-ring-c{
    inset:180px;

    border-color:
        rgba(202,245,254,.19);

    animation:
        astorrePulseRing
        5s
        ease-in-out
        infinite;
}


.final-core b{
    position:relative;

    z-index:3;

    color:#dff9ff;

    font-size:90px;

    font-weight:400;

    text-shadow:

        0 0 16px
        rgba(130,222,241,.7),

        0 0 50px
        rgba(130,222,241,.21);
}


.final-shell{
    position:relative;

    z-index:3;
}


.final-shell
.section-pretitle{
    margin-top:24px;
}


.final-shell h2{
    max-width:1020px;

    margin:
        18px
        0
        0;

    font-size:
        clamp(
            55px,
            7vw,
            110px
        );

    line-height:.92;

    letter-spacing:-.065em;

    font-weight:520;
}


.final-shell h2 em{
    display:block;

    color:#96c9d6;

    font-style:normal;
}


.final-shell > p{
    max-width:710px;

    margin:
        35px
        0;

    color:#8d9aa0;

    font-size:17px;

    line-height:1.72;
}


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

.site-footer{
    padding:
        38px
        0;

    border-top:
        1px solid
        var(--line);

    background:
        rgba(
            1,
            3,
            4,
            .98
        );
}


.footer-inner{
    display:grid;

    grid-template-columns:
        1fr
        auto
        auto;

    gap:30px;

    align-items:center;

    color:#69777d;

    font-size:12px;
}


.brand-footer{
    color:#fff;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:1100px){

    .orbit-system{
        right:-250px;

        opacity:.56;
    }


    .section-heading,
    .transition-shell,
    .manifesto-shell,
    .human-command-statement{
        grid-template-columns:
            1fr;

        gap:28px;
    }


    .principles-grid{
        grid-column:1;
    }


    .intelligence-architecture{
        grid-template-columns:
            1fr;

        gap:30px;
    }


    .architecture-bridge{
        width:1px;

        height:95px;

        margin:auto;
    }


    .bridge-track{
        left:0;

        right:auto;

        top:0;

        bottom:0;

        width:1px;

        height:auto;

        background:
            linear-gradient(
                180deg,
                rgba(104,197,218,.08),
                rgba(157,230,246,.50),
                rgba(104,197,218,.08)
            );
    }


    .bridge-energy{
        left:-1px;

        top:-35%;

        width:2px;

        height:35%;

        margin:0;

        background:
            linear-gradient(
                180deg,
                transparent,
                #e2fbff,
                transparent
            );

        animation:
            bridgeFlowVertical
            2.7s
            linear
            infinite;
    }


    .bridge-node{
        left:-2px;

        margin:0;
    }


    .bridge-node-a{
        top:24%;
    }


    .bridge-node-b{
        right:auto;

        top:auto;

        bottom:20%;
    }


    .architecture-bridge small{
        left:18px;

        top:44%;

        width:max-content;
    }


    @keyframes bridgeFlowVertical{

        to{
            top:100%;
        }

    }


    .product-systems{
        grid-template-columns:
            1fr;
    }


    .product-system{
        min-height:540px;
    }


    .transition-core{
        right:-280px;

        opacity:.45;
    }

}


@media(max-width:900px){

    .shell{
        width:min(
            calc(100% - 36px),
            var(--shell)
        );
    }


    .header-inner{
        min-height:74px;
    }


    .menu-toggle{
        display:flex;

        width:42px;

        height:42px;

        border:0;

        padding:10px;

        background:none;

        flex-direction:column;

        justify-content:center;

        gap:7px;
    }


    .menu-toggle span{
        width:100%;

        height:1px;

        background:#fff;
    }


    .site-nav{
        position:fixed;

        inset:
            74px
            0
            auto;

        display:none;

        padding:
            24px
            18px
            30px;

        flex-direction:column;

        align-items:flex-start;

        gap:18px;

        background:
            rgba(
                2,
                4,
                5,
                .97
            );

        border-bottom:
            1px solid
            var(--line);

        backdrop-filter:
            blur(20px);
    }


    .site-nav.open{
        display:flex;
    }


    .nav-divider{
        display:none;
    }


    .hero-shell{
        padding-top:106px;

        padding-bottom:40px;
    }


    .hero-wordmark{
        font-size:
            clamp(
                64px,
                16vw,
                108px
            );
    }


    .hero-statement h2{
        font-size:
            clamp(
                34px,
                8vw,
                56px
            );
    }


    .hero-actions{
        flex-direction:column;

        align-items:flex-start;
    }


    .btn{
        width:100%;

        max-width:350px;
    }


    .orbit-system{
        width:520px;

        height:520px;

        right:-360px;

        opacity:.36;
    }


    .hero-circuit-svg{
        opacity:.52;
    }


    .system-evolution,
    .products-future,
    .transition-section,
    .manifesto-future,
    .final-future{
        padding:
            100px
            0;
    }


    .intelligence-architecture{
        margin-top:80px;
    }


    .architecture-stage,
    .astorre-stage{
        min-height:430px;
    }


    .product-system{
        min-height:500px;
    }


    .transition-copy-grid{
        grid-template-columns:1fr;

        gap:24px;
    }


    .transition-line{
        grid-template-columns:
            1fr;

        gap:14px;
    }


    .transition-line i{
        width:1px;

        height:24px;

        margin-left:4px;

        background:
            linear-gradient(
                180deg,
                rgba(112,204,224,.08),
                rgba(151,229,245,.42),
                rgba(112,204,224,.08)
            );
    }


    .principles-grid{
        grid-template-columns:1fr;
    }


    .principles-grid article,
    .principles-grid article + article{
        min-height:auto;

        padding:
            30px
            0;

        border-right:0;

        border-bottom:
            1px solid
            var(--line);
    }


    .principles-grid article:last-child{
        border-bottom:0;
    }


    .final-core{
        right:-310px;

        opacity:.45;
    }


    .footer-inner{
        grid-template-columns:1fr;

        gap:12px;
    }

}


@media(max-width:560px){

    .hero-kicker{
        font-size:8px;

        letter-spacing:.16em;
    }


    .hero-kicker i{
        width:18px;
    }


    .hero-wordmark{
        margin-top:25px;

        font-size:
            clamp(
                50px,
                17vw,
                76px
            );
    }


    .hero-statement{
        margin-top:32px;
    }


    .hero-statement p{
        font-size:16px;
    }


    .section-heading h2{
        font-size:
            clamp(
                42px,
                13vw,
                64px
            );
    }


    .architecture-stage,
    .astorre-stage{
        min-height:390px;

        padding-inline:0;
    }


    .architecture-visual{
        transform:
            scale(.86);
    }


    .human-command-statement h3{
        font-size:28px;
    }


    .human-command-statement p{
        font-size:15px;
    }


    .product-system{
        min-height:470px;

        padding:23px;
    }


    .product-system-copy h3{
        font-size:32px;
    }


    .transition-content h2{
        font-size:
            clamp(
                44px,
                14vw,
                70px
            );
    }


    .manifesto-main h2{
        font-size:
            clamp(
                44px,
                14vw,
                70px
            );
    }


    .manifesto-lead{
        font-size:18px;
    }


    .final-shell h2{
        font-size:
            clamp(
                48px,
                14vw,
                74px
            );
    }


    .laser,
    .section-laser,
    .products-laser,
    .transition-ray,
    .final-laser{
        opacity:.22;
    }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

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

    *,
    *::before,
    *::after{
        scroll-behavior:auto !important;

        animation-duration:.01ms !important;

        animation-iteration-count:1 !important;
    }

}