/* ========================================================= */
/* ARS HERITAGE GROUP — HOME                                */
/* STYLE-HOME.CSS — SECTION 01                              */
/* FOUNDATION / RESET / GLOBAL BASE                         */
/* ========================================================= */


/* ========================================================= */
/* 01 — ROOT SYSTEM                                         */
/* ========================================================= */

:root{

    --ars-black:#050505;
    --ars-deep:#080808;
    --ars-deeper:#020202;

    --ars-gold:#c9a45c;
    --ars-gold-light:#e6c985;
    --ars-gold-bright:#f4d991;
    --ars-gold-dark:#8e6d32;

    --ars-white:#f4f1e8;
    --ars-text:#d8d3c8;
    --ars-muted:#918c82;

    --ars-border:rgba(201,164,92,.22);
    --ars-border-soft:rgba(255,255,255,.08);

    --ars-glass:rgba(12,12,12,.62);
    --ars-glass-heavy:rgba(8,8,8,.82);

    --ars-container:1380px;

    --ars-radius:22px;

    --ars-transition:
        420ms cubic-bezier(.22,.61,.36,1);

    --ars-slow-transition:
        900ms cubic-bezier(.22,.61,.36,1);

}


/* ========================================================= */
/* 02 — UNIVERSAL RESET                                     */
/* ========================================================= */

*,
*::before,
*::after{

    box-sizing:border-box;

    margin:0;
    padding:0;

}


html{

    width:100%;

    min-height:100%;

    scroll-behavior:smooth;

    background:
        var(--ars-deeper);

}


body{

    width:100%;

    min-height:100vh;

    overflow-x:hidden;

    background:
        var(--ars-deeper);

    color:
        var(--ars-white);

    font-family:
        "Segoe UI",
        Arial,
        Helvetica,
        sans-serif;

    font-size:16px;

    line-height:1.7;

    -webkit-font-smoothing:antialiased;

    -moz-osx-font-smoothing:grayscale;

}


/* ========================================================= */
/* 03 — MEDIA ELEMENTS                                      */
/* ========================================================= */

img{

    display:block;

    max-width:100%;

    height:auto;

}


a{

    color:inherit;

    text-decoration:none;

}


button,
input,
textarea,
select{

    font:inherit;

}


/* ========================================================= */
/* 04 — SELECTION                                           */
/* ========================================================= */

::selection{

    background:
        rgba(201,164,92,.28);

    color:
        #ffffff;

}


/* ========================================================= */
/* 05 — BODY ATMOSPHERE                                     */
/* ========================================================= */

body::before{

    content:"";

    position:fixed;

    inset:0;

    z-index:-10;

    pointer-events:none;

    background:

        radial-gradient(
            circle at 50% 0%,
            rgba(201,164,92,.045),
            transparent 32%
        ),

        radial-gradient(
            circle at 15% 60%,
            rgba(255,255,255,.018),
            transparent 28%
        ),

        linear-gradient(
            180deg,
            #020202 0%,
            #050505 45%,
            #020202 100%
        );

}


/* ========================================================= */
/* 06 — GLOBAL CONTAINER                                    */
/* ========================================================= */

.container{

    width:
        min(
            calc(100% - 48px),
            var(--ars-container)
        );

    margin-left:auto;

    margin-right:auto;

    position:relative;

}


/* ========================================================= */
/* 07 — GLOBAL SECTION BASE                                 */
/* ========================================================= */

section{

    position:relative;

    width:100%;

    overflow:hidden;

}


/* ========================================================= */
/* 08 — GLOBAL SECTION SPACING                              */
/* ========================================================= */

.about-ars,
.mission-vision,
.ars-philosophy-home,
.ecosystem,
.future-roadmap,
.future-vision{

    padding-top:120px;

    padding-bottom:120px;

}


/* ========================================================= */
/* 09 — SECTION HEADER FOUNDATION                           */
/* ========================================================= */

.section-header{

    position:relative;

    max-width:900px;

    margin-left:auto;

    margin-right:auto;

    margin-bottom:70px;

    text-align:center;

}


/* ========================================================= */
/* 10 — SECTION LABEL                                       */
/* ========================================================= */

.section-label{

    display:inline-block;

    margin-bottom:18px;

    color:
        var(--ars-gold-light);

    font-size:12px;

    font-weight:600;

    letter-spacing:.24em;

    line-height:1.4;

    text-transform:uppercase;

}


/* ========================================================= */
/* 11 — GLOBAL HEADINGS                                     */
/* ========================================================= */

.section-header h2{

    color:
        var(--ars-white);

    font-size:
        clamp(
            34px,
            4vw,
            64px
        );

    font-weight:500;

    line-height:1.12;

    letter-spacing:-.025em;

}


/* ========================================================= */
/* 12 — GLOBAL SECTION DESCRIPTION                          */
/* ========================================================= */

.section-header p{

    max-width:760px;

    margin:26px auto 0;

    color:
        var(--ars-muted);

    font-size:
        clamp(
            15px,
            1.25vw,
            18px
        );

    line-height:1.9;

}


/* ========================================================= */
/* 13 — GLOBAL GOLD LINE                                    */
/* ========================================================= */

.section-header::after{

    content:"";

    display:block;

    width:70px;

    height:1px;

    margin:28px auto 0;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--ars-gold),
            transparent
        );

    opacity:.75;

}


/* ========================================================= */
/* 14 — SCROLLBAR                                           */
/* ========================================================= */

::-webkit-scrollbar{

    width:8px;

}


::-webkit-scrollbar-track{

    background:
        #020202;

}


::-webkit-scrollbar-thumb{

    background:
        linear-gradient(
            180deg,
            var(--ars-gold-dark),
            var(--ars-gold)
        );

    border-radius:10px;

}


::-webkit-scrollbar-thumb:hover{

    background:
        var(--ars-gold-light);

}


/* ========================================================= */
/* 15 — FOCUS ACCESSIBILITY                                 */
/* ========================================================= */

a:focus-visible,
button:focus-visible{

    outline:

        1px solid
        var(--ars-gold-light);

    outline-offset:5px;

}


/* ========================================================= */
/* 16 — REDUCED MOTION                                     */
/* ========================================================= */

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

    html{

        scroll-behavior:auto;

    }

    *,
    *::before,
    *::after{

        animation-duration:.01ms !important;

        animation-iteration-count:1 !important;

        transition-duration:.01ms !important;

    }

}


/* ========================================================= */
/* 17 — TABLET FOUNDATION                                  */
/* ========================================================= */

@media (max-width:900px){

    .container{

        width:
            min(
                calc(100% - 36px),
                var(--ars-container)
            );

    }


    .about-ars,
    .mission-vision,
    .ars-philosophy-home,
    .ecosystem,
    .future-roadmap,
    .future-vision{

        padding-top:90px;

        padding-bottom:90px;

    }


    .section-header{

        margin-bottom:52px;

    }

}


/* ========================================================= */
/* 18 — MOBILE FOUNDATION                                  */
/* ========================================================= */

@media (max-width:600px){

    .container{

        width:
            calc(100% - 28px);

    }


    .about-ars,
    .mission-vision,
    .ars-philosophy-home,
    .ecosystem,
    .future-roadmap,
    .future-vision{

        padding-top:72px;

        padding-bottom:72px;

    }


    .section-header{

        margin-bottom:42px;

    }


    .section-label{

        font-size:10px;

        letter-spacing:.18em;

    }


    .section-header h2{

        font-size:
            clamp(
                30px,
                9vw,
                44px
            );

    }


    .section-header p{

        font-size:14px;

        line-height:1.8;

    }

}


/* ========================================================= */
/* END — SECTION 01                                        */
/* ========================================================= */
/* ========================================================= */
/* ARS HERITAGE GROUP — HOME                                 */
/* SECTION 02 — HERO                                         */
/* MASTER PREMIUM HERO — V1                                  */
/* ========================================================= */


/* ========================================================= */
/* HERO ROOT                                                 */
/* ========================================================= */

.hero{

    position:relative;

    width:100%;

    min-height:200vh;

    overflow:hidden;

    isolation:isolate;

    background:
        radial-gradient(
            circle at 50% 38%,
            rgba(190,145,65,.16),
            transparent 22%
        ),
        radial-gradient(
            circle at 50% 45%,
            rgba(255,255,255,.035),
            transparent 38%
        ),
        linear-gradient(
            180deg,
            #020304 0%,
            #050607 38%,
            #030405 72%,
            #010202 100%
        );

}


/* ========================================================= */
/* HERO BACKGROUND                                           */
/* ========================================================= */

.hero-background{

    position:absolute;

    inset:0;

    z-index:-8;

    background:
        radial-gradient(
            ellipse at 50% 38%,
            rgba(215,170,82,.12),
            transparent 26%
        ),
        radial-gradient(
            ellipse at 50% 55%,
            rgba(120,90,35,.07),
            transparent 48%
        );

}


/* ========================================================= */
/* STAR FIELD                                                */
/* ========================================================= */

.hero-stars,
.hero-stars-2{

    position:absolute;

    inset:0;

    pointer-events:none;

    z-index:-7;

    opacity:.38;

    background-image:
        radial-gradient(
            circle,
            rgba(255,255,255,.65) 0 1px,
            transparent 1.5px
        );

    background-size:
        170px 170px;

    animation:
        arsStarDrift 40s linear infinite;

}


.hero-stars-2{

    opacity:.18;

    background-size:
        290px 290px;

    animation-duration:
        65s;

    animation-direction:
        reverse;

}


/* ========================================================= */
/* HERO CONTAINER                                            */
/* ========================================================= */

.hero > .container{

    width:100%;

    max-width:none;

    margin:0 auto;

    padding:0;

}


/* ========================================================= */
/* HERO WRAPPER                                              */
/* ========================================================= */

.hero-wrapper{

    position:relative;

    width:100%;

    min-height:200vh;

    display:flex;

    flex-direction:column;

    align-items:center;

}


/* ========================================================= */
/* DEEP ENERGY UNIVERSE                                      */
/* ========================================================= */

.home-energy-universe{

    position:absolute;

    width:min(1500px, 100vw);

    height:min(1500px, 100vw);

    left:50%;

    top:47%;

    transform:
        translate(
            calc(-50% + var(--energy-parallax-x, 0px)),
            calc(-50% + var(--energy-parallax-y, 0px))
        );

    z-index:0;

    pointer-events:none;

    transition:
        transform .25s ease-out;

}


/* ========================================================= */
/* DEEP SPACE DEPTH                                          */
/* ========================================================= */

.home-energy-depth{

    position:absolute;

    inset:0;

    border-radius:50%;

    pointer-events:none;

}


.depth-01{

    background:
        radial-gradient(
            circle,
            rgba(255,205,105,.045) 0%,
            transparent 42%
        );

    filter:blur(35px);

}


.depth-02{

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.025) 0%,
            transparent 58%
        );

    filter:blur(70px);

}


.depth-03{

    background:
        radial-gradient(
            circle,
            rgba(185,135,55,.035) 0%,
            transparent 70%
        );

    filter:blur(110px);

}


/* ========================================================= */
/* CENTRAL RADIATION FIELD                                   */
/* ========================================================= */

.home-radiation-field{

    position:absolute;

    left:50%;

    top:50%;

    border-radius:50%;

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

    pointer-events:none;

}


.radiation-01{

    width:52%;

    height:52%;

    background:
        radial-gradient(
            circle,
            rgba(255,204,95,.14),
            rgba(255,180,50,.035) 38%,
            transparent 70%
        );

    filter:blur(35px);

    animation:
        arsRadiationPulse 6s ease-in-out infinite;

}


.radiation-02{

    width:75%;

    height:75%;

    border:
        1px solid rgba(212,166,74,.08);

    filter:blur(1px);

}


.radiation-03{

    width:92%;

    height:92%;

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

}


/* ========================================================= */
/* MASTER ORBITAL RINGS                                     */
/* ========================================================= */

.home-master-orbit{

    position:absolute;

    left:50%;

    top:50%;

    border-radius:50%;

    transform:
        translate(-50%,-50%)
        rotateX(68deg);

    border:
        1px solid rgba(201,155,67,.14);

    box-shadow:
        0 0 30px rgba(190,140,55,.035);

}


.master-orbit-01{

    width:48%;

    height:48%;

    animation:
        arsOrbitRotate 35s linear infinite;

}


.master-orbit-02{

    width:65%;

    height:65%;

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

    animation:
        arsOrbitRotateReverse 48s linear infinite;

}


.master-orbit-03{

    width:82%;

    height:82%;

    border-color:
        rgba(201,155,67,.075);

    animation:
        arsOrbitRotate 70s linear infinite;

}


.master-orbit-04{

    width:96%;

    height:96%;

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

    animation:
        arsOrbitRotateReverse 90s linear infinite;

}


/* ========================================================= */
/* ENERGY RAYS                                               */
/* ========================================================= */

.home-energy-ray{

    position:absolute;

    left:50%;

    top:50%;

    width:1px;

    height:48%;

    transform-origin:
        50% 100%;

    background:
        linear-gradient(
            to top,
            rgba(220,173,79,.20),
            transparent
        );

    opacity:.22;

}


.ray-01{ transform:translate(-50%,-100%) rotate(0deg); }
.ray-02{ transform:translate(-50%,-100%) rotate(45deg); }
.ray-03{ transform:translate(-50%,-100%) rotate(90deg); }
.ray-04{ transform:translate(-50%,-100%) rotate(135deg); }
.ray-05{ transform:translate(-50%,-100%) rotate(180deg); }
.ray-06{ transform:translate(-50%,-100%) rotate(225deg); }
.ray-07{ transform:translate(-50%,-100%) rotate(270deg); }
.ray-08{ transform:translate(-50%,-100%) rotate(315deg); }


/* ========================================================= */
/* ENERGY LINKS                                              */
/* ========================================================= */

.home-energy-link{

    position:absolute;

    left:50%;

    top:50%;

    width:42%;

    height:1px;

    transform-origin:left center;

    background:
        linear-gradient(
            90deg,
            rgba(208,163,72,.16),
            transparent
        );

    opacity:.3;

}


/* ========================================================= */
/* PARTICLE FIELD                                            */
/* ========================================================= */

.home-particle-field{

    position:absolute;

    inset:0;

}


.home-particle{

    position:absolute;

    width:3px;

    height:3px;

    border-radius:50%;

    background:
        rgba(235,194,105,.7);

    box-shadow:
        0 0 8px rgba(220,170,75,.45);

    animation:
        arsParticleFloat
        var(--particle-speed, 8s)
        ease-in-out
        infinite alternate;

}


.p-01{left:14%;top:18%;--particle-speed:7s;}
.p-02{left:27%;top:11%;--particle-speed:10s;}
.p-03{left:43%;top:16%;--particle-speed:8s;}
.p-04{left:63%;top:12%;--particle-speed:9s;}
.p-05{left:81%;top:21%;--particle-speed:11s;}

.p-06{left:9%;top:39%;--particle-speed:9s;}
.p-07{left:19%;top:58%;--particle-speed:12s;}
.p-08{left:31%;top:76%;--particle-speed:8s;}
.p-09{left:48%;top:87%;--particle-speed:10s;}
.p-10{left:69%;top:78%;--particle-speed:9s;}

.p-11{left:88%;top:61%;--particle-speed:12s;}
.p-12{left:76%;top:44%;--particle-speed:8s;}
.p-13{left:58%;top:30%;--particle-speed:11s;}
.p-14{left:38%;top:37%;--particle-speed:9s;}
.p-15{left:23%;top:44%;--particle-speed:10s;}

.p-16{left:72%;top:29%;--particle-speed:7s;}
.p-17{left:86%;top:34%;--particle-speed:11s;}
.p-18{left:12%;top:69%;--particle-speed:8s;}
.p-19{left:54%;top:74%;--particle-speed:10s;}
.p-20{left:91%;top:79%;--particle-speed:9s;}


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

.ars-orbit{

    position:absolute;

    width:min(1120px, 88vw);

    height:min(1120px, 88vw);

    left:50%;

    top:47%;

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

    z-index:3;

}


/* ========================================================= */
/* CENTRAL CORE                                              */
/* ========================================================= */

.orbit-core{

    position:absolute;

    left:50%;

    top:50%;

    width:280px;

    height:280px;

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

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    z-index:20;

    text-decoration:none;

}


.orbit-core img{

    position:relative;

    width:190px;

    height:190px;

    object-fit:contain;

    z-index:5;

    filter:
        drop-shadow(
            0 0 18px rgba(220,173,78,.42)
        )
        drop-shadow(
            0 0 55px rgba(220,173,78,.18)
        );

    transition:
        transform .5s ease,
        filter .5s ease;

}


.orbit-core:hover img{

    transform:scale(1.08);

    filter:
        drop-shadow(
            0 0 24px rgba(235,190,90,.7)
        )
        drop-shadow(
            0 0 80px rgba(235,190,90,.28)
        );

}


/* ========================================================= */
/* CORE ENERGY                                              */
/* ========================================================= */

.orbit-core-energy{

    position:absolute;

    inset:0;

    border-radius:50%;

}


.core-energy-halo{

    position:absolute;

    inset:-40px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(225,178,82,.20),
            transparent 66%
        );

    filter:blur(20px);

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

}


.core-energy-ring{

    position:absolute;

    left:50%;

    top:50%;

    border-radius:50%;

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

    border:
        1px solid rgba(216,171,78,.34);

}


.core-ring-01{

    width:100%;

    height:100%;

    animation:
        arsRingSpin 20s linear infinite;

}


.core-ring-02{

    width:116%;

    height:116%;

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

    animation:
        arsRingSpinReverse 28s linear infinite;

}


.core-ring-03{

    width:136%;

    height:136%;

    border-color:
        rgba(216,171,78,.12);

    animation:
        arsRingSpin 40s linear infinite;

}


.core-ring-04{

    width:158%;

    height:158%;

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

}


/* ========================================================= */
/* INNER / OUTER ORBIT WRAPPERS                              */
/* ========================================================= */

.orbit-inner,
.orbit-outer{

    position:absolute;

    inset:0;

}


/* ========================================================= */
/* ORBIT NODE                                                */
/* ========================================================= */

.orbit-item{

    position:absolute;

    width:120px;

    height:120px;

    z-index:10;

}


.orbit-link{

    position:absolute;

    inset:0;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    text-decoration:none;

    z-index:5;

}


.orbit-link img{

    width:82px;

    height:82px;

    object-fit:contain;

    filter:
        drop-shadow(
            0 0 12px rgba(205,160,68,.22)
        );

    transition:
        transform .45s ease,
        filter .45s ease;

}


.orbit-item:hover .orbit-link img{

    transform:scale(1.13);

    filter:
        drop-shadow(
            0 0 18px rgba(225,180,82,.55)
        )
        drop-shadow(
            0 0 38px rgba(225,180,82,.18)
        );

}


/* ========================================================= */
/* NODE ENERGY                                              */
/* ========================================================= */

.orbit-node-energy{

    position:absolute;

    inset:0;

    pointer-events:none;

}


.node-energy-halo{

    position:absolute;

    inset:-22px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(211,164,71,.16),
            transparent 68%
        );

    filter:blur(14px);

    opacity:.45;

}


.node-energy-ring{

    position:absolute;

    left:50%;

    top:50%;

    width:100%;

    height:100%;

    border-radius:50%;

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

    border:
        1px solid rgba(211,164,71,.20);

}


.node-ring-02{

    width:118%;

    height:118%;

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

}


.node-ring-03{

    width:142%;

    height:142%;

    border-color:
        rgba(211,164,71,.06);

}


.node-energy-pulse{

    position:absolute;

    inset:35px;

    border-radius:50%;

    background:
        rgba(220,174,80,.15);

    filter:blur(8px);

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

}


/* ========================================================= */
/* NODE SPARKS                                              */
/* ========================================================= */

.node-energy-spark{

    position:absolute;

    width:3px;

    height:3px;

    border-radius:50%;

    background:
        rgba(238,200,112,.9);

    box-shadow:
        0 0 9px rgba(230,180,78,.7);

}


.spark-01{

    left:5%;

    top:50%;

}


.spark-02{

    right:5%;

    top:25%;

}


.spark-03{

    left:25%;

    bottom:3%;

}


/* ========================================================= */
/* INNER ORBIT POSITIONS                                     */
/* ========================================================= */

.orbit-inner .orbit-1{
    left:50%;
    top:10%;
    transform:translateX(-50%);
}

.orbit-inner .orbit-2{
    left:10%;
    top:31%;
}

.orbit-inner .orbit-3{
    left:22%;
    bottom:10%;
}

.orbit-inner .orbit-4{
    right:22%;
    bottom:10%;
}

.orbit-inner .orbit-5{
    right:10%;
    top:31%;
}

.orbit-inner .orbit-6{
    left:50%;
    bottom:10%;
    transform:translateX(-50%);
}


/* ========================================================= */
/* OUTER ORBIT POSITIONS                                     */
/* ========================================================= */

.orbit-outer .orbit-7{
    left:50%;
    top:0;
    transform:translateX(-50%);
}

.orbit-outer .orbit-8{
    left:13%;
    top:12%;
}

.orbit-outer .orbit-9{
    left:0;
    top:43%;
}

.orbit-outer .orbit-10{
    left:17%;
    bottom:4%;
}

.orbit-outer .orbit-11{
    right:17%;
    bottom:4%;
}

.orbit-outer .orbit-12{
    right:0;
    top:43%;
}

.orbit-outer .orbit-13{
    right:13%;
    top:12%;
}


/* ========================================================= */
/* ACTIVE NODE                                               */
/* ========================================================= */

.orbit-item.is-active{

    z-index:30;

}


.orbit-item.is-active .node-energy-halo{

    opacity:.95;

    transform:scale(1.18);

}


.orbit-item.is-active .node-energy-ring{

    border-color:
        rgba(230,183,83,.72);

    box-shadow:
        0 0 18px rgba(220,170,70,.20),
        inset 0 0 18px rgba(220,170,70,.08);

}


.orbit-item.is-active .orbit-link img{

    transform:scale(1.16);

}


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

.hero-content{

    position:absolute;

    z-index:40;

    top:72%;

    left:50%;

    width:min(900px, 90vw);

    transform:
        translateX(-50%);

    text-align:center;

}


.hero-label{

    display:block;

    margin-bottom:22px;

    font-size:
        .72rem;

    letter-spacing:
        .32em;

    text-transform:
        uppercase;

    color:
        rgba(218,175,87,.86);

}


.hero-content h1{

    margin:0;

    font-size:
        clamp(2.8rem, 5vw, 5.8rem);

    line-height:
        1.02;

    letter-spacing:
        -.025em;

    font-weight:600;

    color:
        #f3f0e8;

    text-shadow:
        0 0 35px rgba(255,255,255,.07);

}


.hero-content p{

    max-width:760px;

    margin:32px auto 0;

    font-size:
        clamp(.95rem, 1.2vw, 1.12rem);

    line-height:
        1.9;

    color:
        rgba(235,235,230,.66);

}


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

.hero-buttons{

    display:flex;

    justify-content:center;

    gap:18px;

    margin-top:38px;

    flex-wrap:wrap;

}


.hero-buttons a{

    min-width:210px;

    padding:15px 25px;

    border-radius:4px;

    text-decoration:none;

    font-size:.78rem;

    letter-spacing:.12em;

    text-transform:uppercase;

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

}


.btn-primary{

    color:#080706;

    background:
        linear-gradient(
            135deg,
            #e0b65e,
            #b98532
        );

    box-shadow:
        0 10px 35px rgba(190,140,50,.18);

}


.btn-secondary{

    color:
        rgba(238,235,227,.9);

    border:
        1px solid rgba(214,169,76,.35);

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

    backdrop-filter:
        blur(12px);

}


.hero-buttons a:hover{

    transform:
        translateY(-3px);

}


/* ========================================================= */
/* HERO ENERGY READY                                         */
/* ========================================================= */

.hero-energy-ready .home-energy-universe{

    opacity:1;

}


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

.hero.reduced-motion *,
.hero.reduced-motion *::before,
.hero.reduced-motion *::after{

    animation-duration:
        .001ms !important;

    animation-iteration-count:
        1 !important;

    transition-duration:
        .001ms !important;

}


/* ========================================================= */
/* ANIMATIONS                                                */
/* ========================================================= */

@keyframes arsStarDrift{

    from{
        transform:translate3d(0,0,0);
    }

    to{
        transform:translate3d(-80px,60px,0);
    }

}


@keyframes arsRadiationPulse{

    0%,100%{
        transform:translate(-50%,-50%) scale(.94);
        opacity:.65;
    }

    50%{
        transform:translate(-50%,-50%) scale(1.06);
        opacity:1;
    }

}


@keyframes arsCorePulse{

    0%,100%{
        transform:scale(.94);
        opacity:.55;
    }

    50%{
        transform:scale(1.06);
        opacity:1;
    }

}


@keyframes arsRingSpin{

    from{
        transform:
            translate(-50%,-50%)
            rotate(0deg);
    }

    to{
        transform:
            translate(-50%,-50%)
            rotate(360deg);
    }

}


@keyframes arsRingSpinReverse{

    from{
        transform:
            translate(-50%,-50%)
            rotate(360deg);
    }

    to{
        transform:
            translate(-50%,-50%)
            rotate(0deg);
    }

}


@keyframes arsOrbitRotate{

    from{
        transform:
            translate(-50%,-50%)
            rotateX(68deg)
            rotate(0deg);
    }

    to{
        transform:
            translate(-50%,-50%)
            rotateX(68deg)
            rotate(360deg);
    }

}


@keyframes arsOrbitRotateReverse{

    from{
        transform:
            translate(-50%,-50%)
            rotateX(68deg)
            rotate(360deg);
    }

    to{
        transform:
            translate(-50%,-50%)
            rotateX(68deg)
            rotate(0deg);
    }

}


@keyframes arsNodePulse{

    0%,100%{
        opacity:.25;
        transform:scale(.8);
    }

    50%{
        opacity:.75;
        transform:scale(1.15);
    }

}


@keyframes arsParticleFloat{

    from{
        transform:translate3d(0,0,0);
        opacity:.3;
    }

    to{
        transform:translate3d(0,-18px,0);
        opacity:.9;
    }

}


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

@media (max-width:768px){

    .hero,
    .hero-wrapper{

        min-height:175vh;

    }


    .ars-orbit{

        width:94vw;

        height:94vw;

        top:39%;

    }


    .orbit-core{

        width:190px;

        height:190px;

    }


    .orbit-core img{

        width:130px;

        height:130px;

    }


    .orbit-item{

        width:76px;

        height:76px;

    }


    .orbit-link img{

        width:54px;

        height:54px;

    }


    .hero-content{

        top:64%;

        width:88vw;

    }


    .hero-content h1{

        font-size:
            clamp(2.15rem, 9vw, 3.4rem);

    }


    .hero-content p{

        font-size:.9rem;

        line-height:1.75;

    }


    .hero-buttons{

        flex-direction:column;

        align-items:center;

    }


    .hero-buttons a{

        width:min(300px, 85vw);

    }

}


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

@media (max-width:480px){

    .hero,
    .hero-wrapper{

        min-height:165vh;

    }


    .ars-orbit{

        top:36%;

    }


    .orbit-core{

        width:160px;

        height:160px;

    }


    .orbit-core img{

        width:110px;

        height:110px;

    }


    .orbit-item{

        width:64px;

        height:64px;

    }


    .orbit-link img{

        width:46px;

        height:46px;

    }


    .hero-content{

        top:60%;

    }


    .hero-label{

        font-size:.62rem;

        letter-spacing:.22em;

    }

   }

/* =========================================================
   ARS HOME — SECTION 03
   MISSION & VISION
   PREMIUM EDITION
   ========================================================= */

.mission-vision{
    position:relative;
    padding:150px 0 165px;
    overflow:hidden;
    isolation:isolate;
    background:
        radial-gradient(
            circle at 50% 45%,
            rgba(184,137,63,.09),
            transparent 38%
        ),
        linear-gradient(
            180deg,
            #090807 0%,
            #050506 100%
        );
}

.mission-vision::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        radial-gradient(
            circle at 15% 50%,
            rgba(214,170,91,.045),
            transparent 25%
        ),
        radial-gradient(
            circle at 85% 50%,
            rgba(214,170,91,.045),
            transparent 25%
        );
    pointer-events:none;
}

.mission-vision::after{
    content:"";
    position:absolute;
    left:8%;
    right:8%;
    top:0;
    height:1px;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(184,137,63,.28),
            transparent
        );
    box-shadow:
        0 0 25px rgba(184,137,63,.12);
}

.mission-vision .container{
    position:relative;
    z-index:2;
}

.mission-vision .section-header{
    max-width:900px;
    margin:0 auto 75px;
    text-align:center;
}

.mission-vision .section-label{
    display:inline-block;
    margin-bottom:20px;
    color:rgba(214,170,91,.92);
    font-size:12px;
    line-height:1;
    letter-spacing:4px;
    text-transform:uppercase;
}

.mission-vision .section-header h2{
    margin:0;
    color:#f3eee4;
    font-size:clamp(42px,5vw,72px);
    line-height:1.05;
    font-weight:500;
    letter-spacing:-2px;
}

.mission-vision .principles-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:28px;
    max-width:1220px;
    margin:0 auto;
}

.mission-vision .principle-card{
    position:relative;
    min-height:330px;
    padding:45px 38px;
    overflow:hidden;
    border:1px solid rgba(184,137,63,.18);
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.055),
            rgba(255,255,255,.012)
        );
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    box-shadow:
        0 30px 70px rgba(0,0,0,.35),
        inset 0 1px 0 rgba(255,255,255,.045);
    transition:
        transform .55s cubic-bezier(.2,.8,.2,1),
        border-color .45s ease,
        box-shadow .45s ease,
        background .45s ease;
}

.mission-vision .principle-card::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:2px;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(214,170,91,.72),
            transparent
        );
    transform:scaleX(.35);
    transform-origin:center;
    opacity:.65;
    transition:
        transform .55s ease,
        opacity .45s ease;
}

.mission-vision .principle-card::after{
    content:"";
    position:absolute;
    width:170px;
    height:170px;
    right:-85px;
    bottom:-85px;
    border-radius:50%;
    background:
        radial-gradient(
            circle,
            rgba(184,137,63,.13),
            transparent 68%
        );
    pointer-events:none;
}

.mission-vision .principle-card:hover{
    transform:translateY(-10px);
    border-color:rgba(214,170,91,.42);
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.075),
            rgba(184,137,63,.035)
        );
    box-shadow:
        0 38px 90px rgba(0,0,0,.48),
        0 0 35px rgba(184,137,63,.08),
        inset 0 1px 0 rgba(255,255,255,.07);
}

.mission-vision .principle-card:hover::before{
    transform:scaleX(.85);
    opacity:1;
}

.mission-vision .principle-card h3{
    position:relative;
    z-index:2;
    margin:0 0 25px;
    color:#e0b967;
    font-size:25px;
    line-height:1.2;
    font-weight:500;
    letter-spacing:.2px;
}

.mission-vision .principle-card p{
    position:relative;
    z-index:2;
    margin:0;
    color:rgba(238,234,225,.72);
    font-size:16px;
    line-height:1.9;
    font-weight:300;
}

@media (max-width:950px){

    .mission-vision{
        padding:120px 0 130px;
    }

    .mission-vision .principles-grid{
        grid-template-columns:1fr;
        max-width:720px;
    }

    .mission-vision .principle-card{
        min-height:auto;
    }

}

@media (max-width:600px){

    .mission-vision{
        padding:90px 0 100px;
    }

    .mission-vision .section-header{
        margin-bottom:48px;
    }

    .mission-vision .section-header h2{
        font-size:39px;
        letter-spacing:-1px;
    }

    .mission-vision .section-label{
        font-size:10px;
        letter-spacing:3px;
    }

    .mission-vision .principles-grid{
        gap:18px;
    }

    .mission-vision .principle-card{
        padding:34px 27px;
    }

    .mission-vision .principle-card h3{
        font-size:22px;
        margin-bottom:18px;
    }

    .mission-vision .principle-card p{
        font-size:15px;
        line-height:1.8;
    }

   }


/* =========================================================
   ARS HOME — SECTION 04
   ARS PHILOSOPHY
   PREMIUM EDITION
   ========================================================= */

.ars-philosophy-home{
    position:relative;
    padding:165px 0 175px;
    overflow:hidden;
    isolation:isolate;

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(184,137,63,.13),
            transparent 32%
        ),
        radial-gradient(
            circle at 15% 80%,
            rgba(214,170,91,.045),
            transparent 25%
        ),
        linear-gradient(
            180deg,
            #070708 0%,
            #0a0908 50%,
            #050506 100%
        );
}

.ars-philosophy-home::before{
    content:"";
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(184,137,63,.035),
            transparent
        );

    pointer-events:none;
}

.ars-philosophy-home::after{
    content:"";
    position:absolute;
    left:10%;
    right:10%;
    top:0;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(214,170,91,.3),
            transparent
        );

    box-shadow:
        0 0 25px rgba(214,170,91,.12);

    pointer-events:none;
}

.ars-philosophy-home .container{
    position:relative;
    z-index:2;
}

.ars-philosophy-home .section-header{
    max-width:950px;
    margin:0 auto 90px;
    text-align:center;
}

.ars-philosophy-home .section-label{
    display:inline-block;
    margin-bottom:20px;

    color:rgba(214,170,91,.92);

    font-size:12px;
    letter-spacing:4px;
    text-transform:uppercase;
}

.ars-philosophy-home .section-header h2{
    margin:0;

    color:#f4efe5;

    font-size:clamp(42px,5vw,74px);
    line-height:1.04;
    font-weight:500;
    letter-spacing:-2px;

    text-shadow:
        0 0 35px rgba(184,137,63,.08);
}

.philosophy-content{
    position:relative;

    display:grid;
    grid-template-columns:minmax(320px,.85fr) minmax(420px,1.15fr);
    align-items:center;
    gap:90px;

    max-width:1200px;
    margin:0 auto;
}

.concept-logo{
    position:relative;

    min-height:430px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid rgba(184,137,63,.16);

    background:
        radial-gradient(
            circle at center,
            rgba(184,137,63,.11),
            transparent 52%
        ),
        rgba(255,255,255,.018);

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

    box-shadow:
        0 35px 90px rgba(0,0,0,.42),
        inset 0 1px 0 rgba(255,255,255,.05);
}

.concept-logo::before,
.concept-logo::after{
    content:"";
    position:absolute;

    border:1px solid rgba(214,170,91,.15);
    border-radius:50%;

    pointer-events:none;
}

.concept-logo::before{
    width:320px;
    height:320px;

    animation:
        philosophy-orbit 18s linear infinite;
}

.concept-logo::after{
    width:390px;
    height:390px;

    border-style:dashed;
    opacity:.35;

    animation:
        philosophy-orbit-reverse 28s linear infinite;
}

.concept-logo img{
    position:relative;
    z-index:3;

    width:min(230px,55%);
    height:auto;

    object-fit:contain;

    filter:
        drop-shadow(0 0 18px rgba(214,170,91,.2))
        drop-shadow(0 0 45px rgba(184,137,63,.1));

    transition:
        transform .7s cubic-bezier(.2,.8,.2,1),
        filter .7s ease;
}

.concept-logo:hover img{
    transform:scale(1.06);

    filter:
        drop-shadow(0 0 25px rgba(214,170,91,.38))
        drop-shadow(0 0 60px rgba(184,137,63,.18));
}

.concept-glow{
    position:absolute;

    width:210px;
    height:210px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(214,170,91,.22),
            rgba(184,137,63,.07) 38%,
            transparent 72%
        );

    filter:blur(8px);

    animation:
        philosophy-pulse 4.5s ease-in-out infinite;

    pointer-events:none;
}

.philosophy-text{
    position:relative;

    padding:55px 55px 58px;

    border:1px solid rgba(184,137,63,.18);

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.055),
            rgba(255,255,255,.012)
        );

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

    box-shadow:
        0 35px 80px rgba(0,0,0,.38),
        inset 0 1px 0 rgba(255,255,255,.055);
}

.philosophy-text::before{
    content:"";

    position:absolute;

    top:-1px;
    left:12%;

    width:76%;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(214,170,91,.75),
            transparent
        );

    box-shadow:
        0 0 18px rgba(214,170,91,.28);
}

.philosophy-text h3{
    position:relative;
    z-index:2;

    margin:0 0 28px;

    color:#e0b967;

    font-size:30px;
    line-height:1.2;
    font-weight:500;
    letter-spacing:.2px;
}

.philosophy-text p{
    position:relative;
    z-index:2;

    margin:0 0 35px;

    color:rgba(238,234,225,.76);

    font-size:18px;
    line-height:1.95;
    font-weight:300;
}

.philosophy-text blockquote{
    position:relative;
    z-index:2;

    margin:0;

    padding:25px 0 5px 28px;

    border-left:1px solid rgba(214,170,91,.7);

    color:#e1b969;

    font-size:clamp(21px,2vw,29px);
    line-height:1.4;
    font-weight:400;

    text-shadow:
        0 0 22px rgba(214,170,91,.12);
}

@keyframes philosophy-orbit{

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }

}

@keyframes philosophy-orbit-reverse{

    from{
        transform:rotate(360deg);
    }

    to{
        transform:rotate(0deg);
    }

}

@keyframes philosophy-pulse{

    0%,
    100%{
        transform:scale(.88);
        opacity:.55;
    }

    50%{
        transform:scale(1.08);
        opacity:.9;
    }

}

@media (max-width:950px){

    .ars-philosophy-home{
        padding:125px 0 135px;
    }

    .philosophy-content{
        grid-template-columns:1fr;
        gap:45px;
        max-width:720px;
    }

    .concept-logo{
        min-height:380px;
    }

}

@media (max-width:600px){

    .ars-philosophy-home{
        padding:90px 0 100px;
    }

    .ars-philosophy-home .section-header{
        margin-bottom:50px;
    }

    .ars-philosophy-home .section-header h2{
        font-size:39px;
        letter-spacing:-1px;
    }

    .ars-philosophy-home .section-label{
        font-size:10px;
        letter-spacing:3px;
    }

    .concept-logo{
        min-height:310px;
    }

    .concept-logo::before{
        width:235px;
        height:235px;
    }

    .concept-logo::after{
        width:285px;
        height:285px;
    }

    .concept-logo img{
        width:170px;
    }

    .philosophy-text{
        padding:38px 27px 42px;
    }

    .philosophy-text h3{
        font-size:24px;
    }

    .philosophy-text p{
        font-size:16px;
        line-height:1.8;
    }

    .philosophy-text blockquote{
        padding-left:20px;
        font-size:21px;
    }

}

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

    .concept-logo::before,
    .concept-logo::after,
    .concept-glow{
        animation:none;
    }

}
/* ========================================================= */
/* ARS HOME — SECTION 05                                    */
/* MISSION & VISION                                         */
/* ========================================================= */

.mission-vision{

    position:relative;
    padding:170px 0 180px;
    overflow:hidden;
    isolation:isolate;

    background:
        radial-gradient(
            circle at 50% 45%,
            rgba(205,158,70,.10),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            #050505 0%,
            #090807 50%,
            #040404 100%
        );
}

.mission-vision::before{

    content:"";

    position:absolute;
    inset:-20%;

    background:
        radial-gradient(
            circle at 20% 50%,
            rgba(214,170,91,.07),
            transparent 25%
        ),
        radial-gradient(
            circle at 80% 50%,
            rgba(214,170,91,.055),
            transparent 25%
        );

    filter:blur(35px);

    animation:
        missionAmbient 10s ease-in-out infinite;

    pointer-events:none;
    z-index:-2;
}

.mission-vision::after{

    content:"";

    position:absolute;

    top:0;
    left:8%;
    right:8%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(214,170,91,.34),
            transparent
        );

    box-shadow:
        0 0 30px rgba(214,170,91,.10);

    pointer-events:none;
}

.mission-vision .container{

    position:relative;
    z-index:2;
}

.mission-vision .section-header{

    max-width:900px;

    margin:
        0 auto 85px;

    text-align:center;
}

.mission-vision .section-label{

    display:inline-block;

    margin-bottom:22px;

    color:
        rgba(220,181,103,.95);

    font-size:11px;

    letter-spacing:4px;

    text-transform:uppercase;
}

.mission-vision .section-header h2{

    margin:0;

    color:#f2ede3;

    font-size:
        clamp(
            42px,
            5vw,
            72px
        );

    line-height:1.04;

    font-weight:500;

    letter-spacing:-1.8px;
}

.mission-vision .principles-grid{

    display:grid;

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

    gap:28px;

    max-width:1240px;

    margin:0 auto;
}

.mission-vision .principle-card{

    position:relative;

    min-height:360px;

    padding:48px 38px;

    overflow:hidden;

    border:
        1px solid
        rgba(214,170,91,.17);

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.055),
            rgba(255,255,255,.012)
        );

    backdrop-filter:
        blur(20px);

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

    box-shadow:
        0 30px 85px rgba(0,0,0,.42),
        inset 0 1px 0 rgba(255,255,255,.055);

    transition:
        transform .6s cubic-bezier(.2,.8,.2,1),
        border-color .5s ease,
        box-shadow .5s ease;
}

.mission-vision .principle-card::before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(226,185,100,.9),
            transparent
        );

    transform:
        scaleX(.25);

    transition:
        transform .6s ease;
}

.mission-vision .principle-card::after{

    content:"";

    position:absolute;

    width:220px;
    height:220px;

    right:-120px;
    bottom:-120px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(211,164,78,.14),
            transparent 70%
        );

    filter:blur(8px);

    animation:
        missionCardGlow 6s ease-in-out infinite;

    pointer-events:none;
}

.mission-vision .principle-card:hover{

    transform:
        translateY(-12px);

    border-color:
        rgba(222,181,96,.43);

    box-shadow:
        0 45px 110px rgba(0,0,0,.58),
        0 0 55px rgba(211,164,78,.07),
        inset 0 1px 0 rgba(255,255,255,.08);
}

.mission-vision .principle-card:hover::before{

    transform:
        scaleX(.85);
}

.mission-vision .principle-card h3{

    position:relative;
    z-index:2;

    margin:
        0 0 26px;

    color:
        #dfb866;

    font-size:26px;

    line-height:1.2;

    font-weight:500;

    letter-spacing:.1px;
}

.mission-vision .principle-card p{

    position:relative;
    z-index:2;

    margin:0;

    color:
        rgba(237,232,222,.74);

    font-size:16px;

    line-height:1.9;

    font-weight:300;
}

@keyframes missionAmbient{

    0%,
    100%{
        opacity:.45;
        transform:scale(.96);
    }

    50%{
        opacity:1;
        transform:scale(1.04);
    }
}

@keyframes missionCardGlow{

    0%,
    100%{
        opacity:.25;
        transform:scale(.85);
    }

    50%{
        opacity:.75;
        transform:scale(1.12);
    }
}

@media (max-width:950px){

    .mission-vision{

        padding:
            125px 0 140px;
    }

    .mission-vision .principles-grid{

        grid-template-columns:
            1fr;

        max-width:720px;
    }

    .mission-vision .principle-card{

        min-height:auto;
    }
}

@media (max-width:600px){

    .mission-vision{

        padding:
            95px 0 105px;
    }

    .mission-vision .section-header{

        margin-bottom:52px;
    }

    .mission-vision .section-header h2{

        font-size:38px;
        letter-spacing:-1px;
    }

    .mission-vision .principles-grid{

        gap:18px;
    }

    .mission-vision .principle-card{

        padding:
            35px 27px;
    }

    .mission-vision .principle-card h3{

        font-size:22px;
    }

    .mission-vision .principle-card p{

        font-size:15px;
        line-height:1.82;
    }
}

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

    .mission-vision::before,
    .mission-vision .principle-card::after{

        animation:none;
    }

    }



