/* ========================================================= */
/*                                                         */
/*               ARS GLOBAL VISUAL DNA                     */
/*          SHARED DESIGN SYSTEM — ALL ARS PAGES           */
/*                                                         */
/*  ARS HERITAGE GROUP • ARS DESIGN • ARS COMPANY          */
/*  ARS BRAIN • ROSE AI • ZHR NAJI • ALL FUTURE PAGES      */
/*                                                         */
/* ========================================================= */


/* ========================================================= */
/* 01 — GLOBAL COLOR DNA                                    */
/* ========================================================= */

:root{

    /* ----------------------------------------------------- */
    /* CORE BLACK                                             */
    /* ----------------------------------------------------- */

    --ars-black:
        #000000;

    --ars-black-deep:
        #010101;

    --ars-black-surface:
        #030405;


    /* ----------------------------------------------------- */
    /* DEEP NAVY                                              */
    /* ----------------------------------------------------- */

    --ars-navy-deep:
        #020712;

    --ars-navy:
        #06101f;

    --ars-navy-soft:
        #0a1728;


    /* ----------------------------------------------------- */
    /* GOLD                                                   */
    /* ----------------------------------------------------- */

    --ars-gold:
        #c49a4a;

    --ars-gold-light:
        #e6c77a;

    --ars-gold-bright:
        #f3d995;

    --ars-gold-dark:
        #8d6729;


    /* ----------------------------------------------------- */
    /* BRONZE                                                 */
    /* ----------------------------------------------------- */

    --ars-bronze:
        #8f6238;

    --ars-bronze-light:
        #b4875a;

    --ars-bronze-dark:
        #4a2e1c;


    /* ----------------------------------------------------- */
    /* WHITE                                                  */
    /* ----------------------------------------------------- */

    --ars-white:
        #ffffff;

    --ars-white-soft:
        #f4f1e8;

    --ars-white-muted:
        #c8c6bf;


    /* ----------------------------------------------------- */
    /* TECHNOLOGY BLUE                                        */
    /* ----------------------------------------------------- */

    --ars-blue:
        #174b82;

    --ars-blue-light:
        #4d91d1;

    --ars-blue-glow:
        rgba(45,130,220,.35);


    /* ----------------------------------------------------- */
    /* ENERGY RED                                             */
    /* ----------------------------------------------------- */

    --ars-red:
        #7d2024;

    --ars-red-light:
        #bd4b4f;

    --ars-red-glow:
        rgba(180,50,55,.22);


    /* ----------------------------------------------------- */
    /* ENERGY YELLOW                                          */
    /* ----------------------------------------------------- */

    --ars-yellow:
        #d7ad3f;

    --ars-yellow-light:
        #f1d36e;

    --ars-yellow-glow:
        rgba(235,190,65,.25);


    /* ----------------------------------------------------- */
    /* EARTH BROWN                                            */
    /* ----------------------------------------------------- */

    --ars-brown:
        #4a3020;

    --ars-brown-light:
        #806047;


    /* ----------------------------------------------------- */
    /* GLOBAL TEXT                                            */
    /* ----------------------------------------------------- */

    --ars-text:
        #f4f1e8;

    --ars-text-soft:
        rgba(244,241,232,.78);

    --ars-text-muted:
        rgba(244,241,232,.56);


    /* ----------------------------------------------------- */
    /* GLOBAL BORDERS                                         */
    /* ----------------------------------------------------- */

    --ars-border:
        rgba(255,255,255,.10);

    --ars-border-gold:
        rgba(196,154,74,.40);

    --ars-border-gold-bright:
        rgba(230,199,122,.70);


    /* ----------------------------------------------------- */
    /* GLOBAL GLASS                                           */
    /* ----------------------------------------------------- */

    --ars-glass-dark:
        rgba(2,7,15,.76);

    --ars-glass-navy:
        rgba(5,15,29,.68);

    --ars-glass-light:
        rgba(255,255,255,.075);

    --ars-glass-gold:
        rgba(196,154,74,.10);


    /* ----------------------------------------------------- */
    /* GLOBAL SHADOWS                                         */
    /* ----------------------------------------------------- */

    --ars-shadow-black:
        0 25px 80px rgba(0,0,0,.70);

    --ars-shadow-gold:
        0 20px 70px rgba(160,115,35,.18);

    --ars-shadow-blue:
        0 20px 70px rgba(25,85,150,.16);

    --ars-shadow-red:
        0 20px 70px rgba(130,25,30,.12);

}


/* ========================================================= */
/* 02 — GLOBAL RESET                                         */
/* ========================================================= */

html{

    width:100%;

    min-height:100%;

    margin:0;

    padding:0;

    background:
        #000000;

    overflow-x:hidden;

    scroll-behavior:smooth;

}


body{

    width:100%;

    min-height:100vh;

    margin:0;

    padding:0;

    background:
        #000000;

    color:
        var(--ars-text);

    overflow-x:hidden;

    font-family:

        "Inter",
        "Segoe UI",
        Arial,
        sans-serif;

    -webkit-font-smoothing:
        antialiased;

    text-rendering:
        optimizeLegibility;

}


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

    box-sizing:
        border-box;

}


img,
video,
svg,
canvas{

    display:
        block;

    max-width:
        100%;

}


a{

    color:
        inherit;

    text-decoration:
        none;

}


button,
a{

    -webkit-tap-highlight-color:
        transparent;

}


/* ========================================================= */
/* 03 — GLOBAL PAGE BACKGROUND                               */
/* ========================================================= */

body{

    position:
        relative;

    background:

        radial-gradient(
            circle at 50% 0%,
            rgba(20,38,65,.16),
            transparent 32%
        ),

        radial-gradient(
            circle at 15% 35%,
            rgba(196,154,74,.035),
            transparent 30%
        ),

        radial-gradient(
            circle at 85% 70%,
            rgba(23,75,130,.035),
            transparent 32%
        ),

        #000000;

}


/* ========================================================= */
/* 04 — CINEMATIC GLOBAL LIGHT FIELD                         */
/* ========================================================= */

body::before{

    content:"";

    position:
        fixed;

    inset:
        -35%;

    z-index:
        0;

    pointer-events:
        none;

    background:

        radial-gradient(
            ellipse at 25% 20%,
            rgba(196,154,74,.055),
            transparent 28%
        ),

        radial-gradient(
            ellipse at 75% 60%,
            rgba(23,75,130,.045),
            transparent 32%
        ),

        radial-gradient(
            ellipse at 50% 100%,
            rgba(125,32,36,.025),
            transparent 28%
        );

    animation:

        arsGlobalAtmosphere
        22s
        ease-in-out
        infinite
        alternate;

}


@keyframes arsGlobalAtmosphere{

    0%{

        transform:
            translate3d(-2%,-1%,0)
            scale(1);

        opacity:
            .55;

    }

    50%{

        transform:
            translate3d(2%,2%,0)
            scale(1.04);

        opacity:
            .85;

    }

    100%{

        transform:
            translate3d(-1%,3%,0)
            scale(1.08);

        opacity:
            .65;

    }

}


/* ========================================================= */
/* 05 — GLOBAL PAGE ROOT                                     */
/* ========================================================= */

section,
header,
footer,
main,
nav{

    position:
        relative;

    max-width:
        100%;

}


.ars-group-page,
.ars-company-page,
.ars-design-page,
.ars-brain-page,
.ars-future-page{

    position:
        relative;

    z-index:
        1;

    width:
        100%;

    max-width:
        100%;

    overflow:
        hidden;

}


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

.container{

    width:
        min(1400px, 90%);

    max-width:
        100%;

    margin-left:
        auto;

    margin-right:
        auto;

    position:
        relative;

    z-index:
        2;

}


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

section{

    width:
        100%;

    padding:

        clamp(
            90px,
            9vw,
            170px
        )
        0;

    isolation:
        isolate;

}


/* ========================================================= */
/* 08 — GLOBAL SECTION HEADER                                */
/* ========================================================= */

.section-header{

    position:
        relative;

    z-index:
        3;

    width:
        100%;

    max-width:
        1000px;

    margin:

        0
        auto
        70px;

    text-align:
        center;

}


.section-label{

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    margin-bottom:
        20px;

    padding:

        8px
        18px;

    border:

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

    border-radius:
        999px;

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

    background:

        rgba(5,12,22,.55);

    backdrop-filter:
        blur(14px);

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

    box-shadow:

        0
        0
        25px
        rgba(196,154,74,.05);

    font-size:
        .70rem;

    letter-spacing:
        .18em;

    text-transform:
        uppercase;

}


.section-header h2{

    margin:
        0;

    color:
        var(--ars-white-soft);

    font-size:

        clamp(
            2rem,
            4vw,
            4rem
        );

    line-height:
        1.12;

    letter-spacing:
        -.025em;

}


.section-header p{

    max-width:
        780px;

    margin:

        25px
        auto
        0;

    color:
        var(--ars-text-soft);

    line-height:
        1.9;

}


/* ========================================================= */
/* 09 — UNIVERSAL ARS GLASS SYSTEM                           */
/* ========================================================= */

.ars-glass{

    position:
        relative;

    overflow:
        hidden;

    border:

        1px
        solid
        rgba(255,255,255,.11);

    background:

        linear-gradient(
            135deg,
            rgba(255,255,255,.075),
            rgba(255,255,255,.025)
        );

    backdrop-filter:

        blur(24px)
        saturate(125%);

    -webkit-backdrop-filter:

        blur(24px)
        saturate(125%);

    box-shadow:

        var(--ars-shadow-black),

        inset
        0
        1px
        0
        rgba(255,255,255,.10);

    transition:

        transform .6s cubic-bezier(.2,.8,.2,1),

        border-color .5s ease,

        box-shadow .5s ease,

        background .5s ease;

}


/* ========================================================= */
/* 10 — GLASS LIGHT REFLECTION                               */
/* ========================================================= */

.ars-glass::before{

    content:
        "";

    position:
        absolute;

    inset:
        0;

    pointer-events:
        none;

    background:

        linear-gradient(
            115deg,
            transparent 20%,
            rgba(255,255,255,.09) 45%,
            transparent 70%
        );

    transform:
        translateX(-120%);

    transition:
        transform 1.2s ease;

}


.ars-glass:hover::before{

    transform:
        translateX(120%);

}


/* ========================================================= */
/* 11 — GLASS HOVER                                         */
/* ========================================================= */

.ars-glass:hover{

    transform:
        translateY(-10px);

    border-color:
        var(--ars-border-gold-bright);

    box-shadow:

        0
        30px
        90px
        rgba(0,0,0,.78),

        0
        0
        35px
        rgba(196,154,74,.10),

        inset
        0
        1px
        0
        rgba(255,255,255,.18);

}


/* ========================================================= */
/* 12 — GLASS VARIANTS                                      */
/* ========================================================= */

.ars-glass-dark{

    background:

        linear-gradient(
            135deg,
            rgba(0,0,0,.88),
            rgba(4,9,17,.72)
        );

}


.ars-glass-navy{

    background:

        linear-gradient(
            135deg,
            rgba(5,15,29,.82),
            rgba(2,7,14,.65)
        );

    border-color:

        rgba(38,91,145,.25);

}


.ars-glass-gold{

    background:

        linear-gradient(
            135deg,
            rgba(196,154,74,.16),
            rgba(5,13,24,.70)
        );

    border-color:

        rgba(196,154,74,.32);

}


.ars-glass-bronze{

    background:

        linear-gradient(
            135deg,
            rgba(143,98,56,.16),
            rgba(3,7,12,.75)
        );

    border-color:

        rgba(143,98,56,.30);

}


.ars-glass-blue{

    background:

        linear-gradient(
            135deg,
            rgba(23,75,130,.16),
            rgba(2,8,17,.76)
        );

    border-color:

        rgba(77,145,209,.22);

}


.ars-glass-red{

    background:

        linear-gradient(
            135deg,
            rgba(125,32,36,.13),
            rgba(3,7,12,.78)
        );

    border-color:

        rgba(189,75,79,.20);

}


.ars-glass-bright{

    background:

        linear-gradient(
            135deg,
            rgba(255,255,255,.13),
            rgba(255,255,255,.035)
        );

}


.ars-glass-flat{

    box-shadow:

        inset
        0
        1px
        0
        rgba(255,255,255,.08);

}


.ars-glass-floating{

    box-shadow:

        0
        30px
        100px
        rgba(0,0,0,.75),

        0
        0
        40px
        rgba(196,154,74,.08);

}


/* ========================================================= */
/* 13 — GOLD TYPOGRAPHY                                     */
/* ========================================================= */

.gold-text{

    background:

        linear-gradient(
            120deg,
            var(--ars-gold-dark),
            var(--ars-gold-light),
            var(--ars-gold),
            var(--ars-gold-bright)
        );

    -webkit-background-clip:
        text;

    background-clip:
        text;

    color:
        transparent;

}


h1,
h2,
h3,
h4{

    text-wrap:
        balance;

}


h1,
h2,
h3{

    color:
        var(--ars-white-soft);

}


/* ========================================================= */
/* 14 — UNIVERSAL ARS BUTTONS                               */
/* ========================================================= */

.btn-primary,
.btn-secondary{

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        52px;

    padding:

        0
        28px;

    border-radius:
        999px;

    font-size:
        .84rem;

    font-weight:
        600;

    letter-spacing:
        .04em;

    transition:

        transform .4s ease,

        box-shadow .4s ease,

        background .4s ease,

        border-color .4s ease;

}


.btn-primary{

    color:
        #090909;

    background:

        linear-gradient(
            135deg,
            #9e742c,
            #e5c477,
            #b7842e
        );

    box-shadow:

        0
        10px
        35px
        rgba(196,154,74,.20);

}


.btn-secondary{

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

    border:

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

    background:

        rgba(4,11,20,.60);

    backdrop-filter:
        blur(14px);

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

}


.btn-primary:hover,
.btn-secondary:hover{

    transform:
        translateY(-4px);

    box-shadow:

        0
        15px
        45px
        rgba(196,154,74,.28);

}


/* ========================================================= */
/* 15 — GOLD CINEMATIC SCROLL INDICATOR                     */
/* ========================================================= */

.ars-scroll-line{

    position:
        fixed;

    right:
        24px;

    top:
        50%;

    width:
        2px;

    height:
        100px;

    transform:
        translateY(-50%);

    z-index:
        100;

    pointer-events:
        none;

    background:

        linear-gradient(
            180deg,
            transparent,
            var(--ars-gold-light),
            transparent
        );

    opacity:
        .65;

    animation:

        arsScrollGlow
        2.5s
        ease-in-out
        infinite;

}


@keyframes arsScrollGlow{

    0%,
    100%{

        opacity:
            .30;

        box-shadow:
            0
            0
            5px
            rgba(230,199,122,.15);

    }

    50%{

        opacity:
            1;

        box-shadow:
            0
            0
            22px
            rgba(230,199,122,.70);

    }

}


/* ========================================================= */
/* 16 — UNIVERSAL FOCUS                                     */
/* ========================================================= */

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

    outline:

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

    outline-offset:
        5px;

}


/* ========================================================= */
/* 17 — RESPONSIVE DNA                                      */
/* ========================================================= */

@media (max-width:1024px){

    .container{

        width:
            90%;

    }

    section{

        padding:
            100px 0;

    }

}


@media (max-width:768px){

    .container{

        width:
            90%;

    }

    section{

        padding:
            80px 0;

    }

    .section-header{

        margin-bottom:
            50px;

    }

    .section-header h2{

        font-size:

            clamp(
                1.8rem,
                8vw,
                3rem
            );

    }

    .btn-primary,
    .btn-secondary{

        width:
            100%;

    }

}


@media (max-width:480px){

    .container{

        width:
            92%;

    }

    section{

        padding:
            70px 0;

    }

    .section-label{

        font-size:
            .62rem;

        letter-spacing:
            .12em;

    }

}


/* ========================================================= */
/* 18 — MOBILE OVERFLOW PROTECTION                          */
/* ========================================================= */

@media (max-width:768px){

    html,
    body{

        width:
            100%;

        max-width:
            100%;

        overflow-x:
            hidden;

    }

    .ars-glass{

        max-width:
            100%;

        min-width:
            0;

    }

}


/* ========================================================= */
/* 19 — REDUCED MOTION                                      */
/* ========================================================= */

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

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

        animation-duration:
            .01ms !important;

        animation-iteration-count:
            1 !important;

        scroll-behavior:
            auto !important;

        transition-duration:
            .01ms !important;

    }

}

/* ========================================================= */
/* ========================================================= */
/*                                                         */
/*             ARS OPEN DOOR — PAGE DNA                   */
/*             PREMIUM HUMAN CONNECTION                    */
/*             EXCLUSIVE PAGE CSS                          */
/*                                                         */
/* ========================================================= */
/* ========================================================= */


/* ========================================================= */
/* 01 — PAGE FOUNDATION                                      */
/* ========================================================= */

.ars-open-door{
    position:relative;
    width:100%;
    min-height:100vh;
    overflow:hidden;
    isolation:isolate;
    background:
        radial-gradient(
            circle at 50% 8%,
            rgba(184,137,63,.10),
            transparent 26%
        ),
        radial-gradient(
            circle at 8% 42%,
            rgba(20,42,76,.14),
            transparent 30%
        ),
        #030405;
    color:#f3f1eb;
}


/* ========================================================= */
/* 02 — GLOBAL OPEN DOOR BACKGROUND                           */
/* ========================================================= */

.ars-open-door::before{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    z-index:-3;

    background:
        radial-gradient(
            circle at 75% 25%,
            rgba(184,137,63,.07),
            transparent 22%
        ),
        radial-gradient(
            circle at 20% 70%,
            rgba(22,55,100,.08),
            transparent 28%
        );

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


.ars-open-door::after{
    content:"";
    position:fixed;
    width:55vw;
    height:55vw;
    max-width:850px;
    max-height:850px;

    left:50%;
    top:35%;

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

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(184,137,63,.045),
            transparent 65%
        );

    filter:blur(30px);

    pointer-events:none;

    z-index:-4;
}


@keyframes openDoorAtmosphere{

    0%{
        transform:scale(1)
                   translate3d(0,0,0);
        opacity:.65;
    }

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

    100%{
        transform:scale(1.02)
                   translate3d(-1%, 1%, 0);
        opacity:.75;
    }

}


/* ========================================================= */
/* 03 — HERO                                                  */
/* ========================================================= */

.open-door-hero{
    position:relative;
    min-height:100svh;

    display:grid;
    grid-template-columns:
        minmax(0,1fr)
        minmax(320px, .8fr);

    align-items:center;
    gap:clamp(50px,8vw,120px);

    padding:
        clamp(110px,12vw,180px)
        clamp(22px,6vw,100px)
        clamp(80px,9vw,130px);

    max-width:1600px;
    margin:auto;
}


.open-door-bg{
    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            ellipse at 72% 50%,
            rgba(184,137,63,.14),
            transparent 25%
        ),
        radial-gradient(
            ellipse at 30% 30%,
            rgba(27,55,91,.14),
            transparent 30%
        );
}


.open-door-bg::before{
    content:"";

    position:absolute;

    width:60%;
    height:1px;

    top:50%;
    left:0;

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

    filter:blur(1px);

    animation:
        goldenScan 8s ease-in-out infinite;
}


@keyframes goldenScan{

    0%{
        transform:translateX(-30%);
        opacity:0;
    }

    25%{
        opacity:1;
    }

    75%{
        opacity:1;
    }

    100%{
        transform:translateX(130%);
        opacity:0;
    }

}


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

.open-door-hero-content{
    position:relative;
    z-index:2;

    max-width:720px;

    animation:
        heroContentReveal 1.2s
        cubic-bezier(.16,1,.3,1)
        both;
}


@keyframes heroContentReveal{

    from{
        opacity:0;
        transform:
            translateY(40px);
            filter:blur(10px);
    }

    to{
        opacity:1;
        transform:
            translateY(0);
            filter:blur(0);
    }

}


.open-door-hero h1{
    max-width:700px;

    margin:
        20px
        0
        24px;

    font-size:
        clamp(3rem,7vw,7rem);

    line-height:.94;

    letter-spacing:-.055em;

    font-weight:600;

    background:
        linear-gradient(
            115deg,
            #ffffff 10%,
            #f4dfae 42%,
            #b8893f 68%,
            #ffffff 92%
        );

    background-size:220% auto;

    -webkit-background-clip:text;
    background-clip:text;

    color:transparent;

    animation:
        titleGoldFlow 9s
        ease-in-out
        infinite;
}


@keyframes titleGoldFlow{

    0%{
        background-position:0% center;
    }

    50%{
        background-position:100% center;
    }

    100%{
        background-position:0% center;
    }

}


.open-door-hero .hero-lead{
    font-size:
        clamp(1.15rem,2vw,1.55rem);

    line-height:1.7;

    color:#d9c18d;

    max-width:620px;

    margin-bottom:22px;
}


.open-door-hero-content > p:not(.hero-lead){
    max-width:640px;

    color:
        rgba(243,241,235,.68);

    line-height:1.9;

    font-size:1rem;
}


/* ========================================================= */
/* HERO ACTIONS                                               */
/* ========================================================= */

.open-door-actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;

    margin-top:38px;
}


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

.open-door-visual{
    position:relative;

    min-height:
        clamp(420px,55vw,680px);

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

    border-radius:
        42px
        120px
        42px
        120px;

    overflow:hidden;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.08),
            rgba(255,255,255,.025)
        );

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

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.14),

        inset 0 -30px 80px
        rgba(0,0,0,.35),

        0 30px 100px
        rgba(0,0,0,.5),

        0 0 80px
        rgba(184,137,63,.08);

    backdrop-filter:
        blur(22px)
        saturate(125%);

    -webkit-backdrop-filter:
        blur(22px)
        saturate(125%);

    animation:
        visualFloat 8s
        ease-in-out
        infinite;
}


@keyframes visualFloat{

    0%,100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-10px);
    }

}


.open-door-visual::before{
    content:"";

    position:absolute;

    inset:-40%;

    background:
        conic-gradient(
            from 0deg,
            transparent,
            rgba(184,137,63,.2),
            transparent 25%,
            rgba(52,94,145,.12),
            transparent 55%
        );

    animation:
        doorOrbit 14s
        linear
        infinite;
}


@keyframes doorOrbit{

    to{
        transform:rotate(360deg);
    }

}


.open-door-visual::after{
    content:"";

    position:absolute;

    width:65%;
    height:65%;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(184,137,63,.25),
            transparent 68%
        );

    filter:blur(35px);

    animation:
        doorGlow 5s
        ease-in-out
        infinite alternate;
}


@keyframes doorGlow{

    from{
        transform:scale(.88);
        opacity:.55;
    }

    to{
        transform:scale(1.12);
        opacity:1;
    }

}


.door-light{
    position:relative;
    z-index:2;

    width:
        min(68%,420px);

    aspect-ratio:1/1;

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


.door-light::before{
    content:"";

    position:absolute;
    inset:4%;

    border-radius:50%;

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

    box-shadow:
        0 0 35px
        rgba(184,137,63,.16),

        inset 0 0 35px
        rgba(184,137,63,.08);

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


@keyframes doorPulse{

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

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

}


.door-light img{
    position:relative;

    width:82%;
    height:auto;

    object-fit:contain;

    filter:
        drop-shadow(
            0 0 30px
            rgba(184,137,63,.28)
        );

    animation:
        doorImageFloat 6s
        ease-in-out
        infinite;
}


@keyframes doorImageFloat{

    0%,100%{
        transform:translateY(0)
                   scale(1);
    }

    50%{
        transform:translateY(-12px)
                   scale(1.025);
    }

}


/* ========================================================= */
/* 04 — SECTION SYSTEM                                        */
/* ========================================================= */

.open-human-intro,
.open-global,
.founder-connection,
.ars-human-connection,
.ars-community,
.global-message-gateway,
.ars-chat-gateway,
.global-contact,
.open-door-final{
    position:relative;

    padding:
        clamp(90px,10vw,160px)
        0;
}


.open-human-intro::before,
.open-global::before,
.founder-connection::before,
.ars-community::before,
.global-message-gateway::before,
.global-contact::before{
    content:"";

    position:absolute;

    left:10%;
    right:10%;
    top:0;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(184,137,63,.25),
            rgba(255,255,255,.08),
            rgba(184,137,63,.25),
            transparent
        );
}


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

.ars-open-door .section-heading{
    max-width:800px;

    margin:
        0
        auto
        clamp(45px,6vw,80px);

    text-align:center;
}


.ars-open-door .section-heading h2{
    margin:
        18px
        0
        20px;

    font-size:
        clamp(2rem,4vw,4.5rem);

    line-height:1;

    letter-spacing:-.04em;

    color:#f4f1e8;
}


.ars-open-door .section-heading p{
    max-width:680px;

    margin:auto;

    color:
        rgba(243,241,235,.58);

    line-height:1.85;
}


/* ========================================================= */
/* 05 — CONNECTION CARDS                                      */
/* ========================================================= */

.connection-grid{
    display:grid;

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

    gap:18px;
}


.connection-card{
    position:relative;

    min-height:320px;

    padding:34px;

    display:flex;
    flex-direction:column;

    border-radius:
        28px
        28px
        70px
        28px;

    overflow:hidden;

    transition:
        transform .55s
        cubic-bezier(.16,1,.3,1),

        border-color .4s,

        box-shadow .55s;
}


.connection-card::before{
    content:"";

    position:absolute;

    width:180px;
    height:180px;

    top:-90px;
    right:-70px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(184,137,63,.16),
            transparent 68%
        );

    filter:blur(12px);

    transition:
        transform .6s,
        opacity .6s;
}


.connection-card:hover{
    transform:
        translateY(-10px);

    border-color:
        rgba(184,137,63,.38);

    box-shadow:
        0 25px 70px
        rgba(0,0,0,.45),

        0 0 40px
        rgba(184,137,63,.08);
}


.connection-card:hover::before{
    transform:scale(1.5);
}


.card-number{
    display:inline-flex;

    width:42px;
    height:42px;

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

    border-radius:50%;

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

    color:#d7b66e;

    font-size:.75rem;

    margin-bottom:auto;
}


.connection-card h3{
    font-size:1.5rem;

    margin:
        40px
        0
        12px;
}


.connection-card p{
    color:
        rgba(243,241,235,.58);

    line-height:1.75;

    margin:0 0 22px;
}


.card-link,
.contact-link{
    margin-top:auto;

    color:#d7b66e;

    text-decoration:none;

    font-size:.9rem;

    transition:
        color .3s,
        letter-spacing .3s;
}


.card-link:hover,
.contact-link:hover{
    color:#fff;

    letter-spacing:.04em;
}


/* ========================================================= */
/* 06 — GLOBAL CONNECTION                                     */
/* ========================================================= */

.global-panel{
    display:grid;

    grid-template-columns:
        minmax(300px,.85fr)
        minmax(0,1fr);

    gap:
        clamp(40px,7vw,100px);

    align-items:center;

    padding:
        clamp(30px,5vw,70px);

    border-radius:
        50px
        28px
        50px
        100px;

    overflow:hidden;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.065),
            rgba(255,255,255,.018)
        );

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

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.12),

        0 35px 100px
        rgba(0,0,0,.45);
}


.global-visual{
    position:relative;

    aspect-ratio:1;

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

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(184,137,63,.12),
            rgba(15,27,43,.1)
        );
}


.global-visual img{
    position:relative;
    z-index:2;

    width:72%;

    object-fit:contain;

    filter:
        drop-shadow(
            0 0 30px
            rgba(184,137,63,.2)
        );

    animation:
        globalFloat 7s
        ease-in-out
        infinite;
}


@keyframes globalFloat{

    0%,100%{
        transform:translateY(0)
                   rotate(0deg);
    }

    50%{
        transform:translateY(-12px)
                   rotate(2deg);
    }

}


.global-ring{
    position:absolute;

    inset:8%;

    border-radius:50%;

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

    border-top-color:
        transparent;

    animation:
        ringSpin 12s
        linear
        infinite;
}


.global-ring::after{
    content:"";

    position:absolute;

    inset:12%;

    border-radius:50%;

    border:
        1px solid
        rgba(67,105,155,.25);

    border-bottom-color:
        transparent;

    animation:
        ringSpinReverse 9s
        linear
        infinite;
}


@keyframes ringSpin{

    to{
        transform:rotate(360deg);
    }

}


@keyframes ringSpinReverse{

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

}


.global-content h2{
    font-size:
        clamp(2rem,4vw,4rem);

    line-height:1;

    letter-spacing:-.04em;

    margin:
        0
        0
        20px;
}


.global-content > p{
    color:
        rgba(243,241,235,.6);

    line-height:1.85;

    max-width:650px;
}


.global-cards{
    display:grid;

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

    gap:12px;

    margin-top:35px;
}


.global-card{
    padding:22px;

    min-height:180px;

    border-radius:
        22px
        22px
        42px
        22px;

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

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

    transition:
        transform .4s,
        border-color .4s;
}


.global-card:hover{
    transform:translateY(-6px);

    border-color:
        rgba(184,137,63,.28);
}


.global-card h3{
    font-size:1rem;

    margin:
        0
        0
        10px;
}


.global-card p{
    margin:0;

    font-size:.85rem;

    line-height:1.7;

    color:
        rgba(243,241,235,.5);
}


/* ========================================================= */
/* 07 — FOUNDER CONNECTION                                    */
/* ========================================================= */

.founder-panel{
    display:grid;

    grid-template-columns:
        .7fr
        1.3fr;

    gap:
        clamp(40px,7vw,100px);

    align-items:center;

    padding:
        clamp(35px,6vw,80px);

    border-radius:
        100px
        35px
        100px
        35px;
}


.founder-symbol{
    display:flex;

    align-items:center;
    justify-content:center;
}


.founder-orb{
    position:relative;

    width:
        min(100%,400px);

    aspect-ratio:1;

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

    border-radius:50%;

    background:
        radial-gradient(
            circle at 40% 35%,
            rgba(255,255,255,.08),
            rgba(184,137,63,.08) 35%,
            transparent 68%
        );

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

    box-shadow:
        0 0 70px
        rgba(184,137,63,.1);
}


.founder-orb::before{
    content:"";

    position:absolute;

    inset:-15%;

    border-radius:50%;

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

    animation:
        founderOrbit 15s
        linear
        infinite;
}


@keyframes founderOrbit{

    to{
        transform:rotate(360deg);
    }

}


.founder-orb img{
    width:72%;

    border-radius:50%;

    object-fit:cover;

    filter:
        saturate(.75)
        contrast(1.05);

    box-shadow:
        0 20px 60px
        rgba(0,0,0,.5);
}


.founder-content h2{
    font-size:
        clamp(2rem,4vw,4rem);

    line-height:1;

    letter-spacing:-.04em;

    margin:
        0
        0
        20px;
}


.founder-content > p{
    color:
        rgba(243,241,235,.6);

    line-height:1.85;
}


.founder-options{
    display:grid;

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

    gap:12px;

    margin:
        35px
        0;
}


.founder-card{
    padding:22px;

    border-radius:22px;

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

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


.founder-card h3{
    font-size:.95rem;

    margin:
        0
        0
        10px;
}


.founder-card p{
    font-size:.82rem;

    line-height:1.7;

    color:
        rgba(243,241,235,.48);

    margin:0;
}


/* ========================================================= */
/* 08 — HUMAN CONNECTION                                     */
/* ========================================================= */

.ars-human-connection{
    background:
        radial-gradient(
            ellipse at 50% 50%,
            rgba(184,137,63,.045),
            transparent 45%
        );
}


.human-message{
    max-width:1000px;

    margin:auto;

    text-align:center;

    padding:
        clamp(40px,7vw,90px);

    border-radius:
        50px
        100px
        50px
        100px;
}


.human-message h2{
    font-size:
        clamp(2.3rem,5vw,5rem);

    line-height:1;

    letter-spacing:-.05em;

    margin:
        20px
        0
        25px;
}


.human-message > p{
    max-width:750px;

    margin:
        0
        auto
        18px;

    color:
        rgba(243,241,235,.58);

    line-height:1.9;
}


.human-values{
    display:grid;

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

    gap:15px;

    margin-top:45px;
}


.human-card{
    padding:28px;

    border-radius:28px;

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

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


.human-card h3{
    color:#d7b66e;

    margin:
        0
        0
        10px;
}


.human-card p{
    margin:0;

    font-size:.88rem;

    color:
        rgba(243,241,235,.48);
}


/* ========================================================= */
/* 09 — COMMUNITY                                             */
/* ========================================================= */

.community-panel{
    display:grid;

    grid-template-columns:
        1.15fr
        .85fr;

    gap:50px;

    align-items:center;

    padding:
        clamp(30px,5vw,70px);

    border-radius:
        35px
        90px
        35px
        90px;
}


.community-content h2{
    font-size:
        clamp(2rem,4vw,4rem);

    line-height:1;

    letter-spacing:-.04em;

    margin:
        0
        20px;
}


.community-content > p{
    max-width:650px;

    color:
        rgba(243,241,235,.58);

    line-height:1.85;
}


.community-cards{
    display:grid;

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

    gap:12px;

    margin-top:35px;
}


.community-card{
    padding:22px;

    border-radius:
        24px
        24px
        45px
        24px;

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

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


.community-card h3{
    font-size:.95rem;

    margin:
        0
        0
        10px;
}


.community-card p{
    margin:0;

    color:
        rgba(243,241,235,.48);

    font-size:.82rem;

    line-height:1.7;
}


.community-visual{
    position:relative;

    min-height:420px;

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

    border-radius:50px;

    overflow:hidden;

    background:
        radial-gradient(
            circle,
            rgba(184,137,63,.1),
            transparent 65%
        );
}


.community-visual img{
    width:80%;

    object-fit:contain;

    filter:
        drop-shadow(
            0 0 40px
            rgba(184,137,63,.18)
        );

    animation:
        communityFloat 7s
        ease-in-out
        infinite;
}


@keyframes communityFloat{

    0%,100%{
        transform:
            translateY(0)
            rotate(-1deg);
    }

    50%{
        transform:
            translateY(-15px)
            rotate(1deg);
    }

}


.community-close{
    margin-top:25px;

    padding:
        35px;

    text-align:center;

    border-radius:
        30px
        80px
        30px
        80px;
}


.community-close h2{
    margin:0;

    font-size:
        clamp(1.5rem,3vw,3rem);

    letter-spacing:-.03em;
}


/* ========================================================= */
/* 10 — MESSAGE GATEWAY                                      */
/* ========================================================= */

.message-gateway{
    display:grid;

    grid-template-columns:
        .45fr
        1.55fr;

    gap:
        clamp(35px,6vw,80px);

    align-items:center;

    padding:
        clamp(35px,6vw,80px);

    border-radius:
        100px
        35px
        100px
        35px;
}


.gateway-core{
    display:flex;

    align-items:center;
    justify-content:center;
}


.language-orb{
    position:relative;

    width:
        min(260px,60vw);

    aspect-ratio:1;

    display:flex;

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

    border-radius:50%;

    background:
        radial-gradient(
            circle at 35% 30%,
            rgba(255,255,255,.12),
            rgba(184,137,63,.12) 30%,
            rgba(10,20,32,.4) 65%
        );

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

    box-shadow:
        0 0 80px
        rgba(184,137,63,.1);
}


.language-orb::before,
.language-orb::after{
    content:"";

    position:absolute;

    inset:-15%;

    border-radius:50%;

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


.language-orb::before{
    transform:
        rotate(45deg)
        scaleX(1.5);

    animation:
        gatewayOrbit 12s
        linear
        infinite;
}


.language-orb::after{
    transform:
        rotate(-45deg)
        scaleX(1.5);

    animation:
        gatewayOrbitReverse 16s
        linear
        infinite;
}


@keyframes gatewayOrbit{

    to{
        transform:
            rotate(405deg)
            scaleX(1.5);
    }

}


@keyframes gatewayOrbitReverse{

    to{
        transform:
            rotate(-405deg)
            scaleX(1.5);
    }

}


.language-orb span{
    font-size:5rem;

    color:#d7b66e;

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


.gateway-content h2{
    font-size:
        clamp(2rem,4vw,4rem);

    line-height:1;

    letter-spacing:-.04em;

    margin:
        0
        0
        20px;
}


.gateway-content > p{
    color:
        rgba(243,241,235,.58);

    line-height:1.8;
}


.gateway-options{
    display:grid;

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

    gap:12px;

    margin-top:35px;
}


.gateway-card{
    padding:24px;

    border-radius:24px;

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

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

    transition:
        transform .4s,
        border-color .4s;
}


.gateway-card:hover{
    transform:translateY(-5px);

    border-color:
        rgba(184,137,63,.28);
}


.gateway-card h3{
    margin:
        0
        0
        10px;
}


.gateway-card p{
    margin:0;

    color:
        rgba(243,241,235,.48);

    font-size:.85rem;

    line-height:1.7;
}


/* ========================================================= */
/* 11 — MESSAGE FORM                                         */
/* ========================================================= */

.message-form-panel{
    margin-top:30px;

    padding:
        clamp(30px,6vw,80px);

    border-radius:
        40px
        100px
        40px
        100px;
}


.form-heading{
    max-width:650px;

    margin-bottom:45px;
}


.form-heading h2{
    font-size:
        clamp(2rem,4vw,4rem);

    line-height:1;

    margin:
        18px
        0;
}


.form-heading p{
    color:
        rgba(243,241,235,.55);
}


.form-grid{
    display:grid;

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

    gap:18px;
}


.form-field{
    display:flex;

    flex-direction:column;

    gap:9px;

    margin-bottom:20px;
}


.form-field label{
    font-size:.78rem;

    letter-spacing:.08em;

    text-transform:uppercase;

    color:
        rgba(243,241,235,.58);
}


.form-field input,
.form-field select,
.form-field textarea{
    width:100%;

    padding:
        17px
        18px;

    border-radius:18px;

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

    background:
        rgba(0,0,0,.28);

    color:#f5f1e8;

    font:
        inherit;

    outline:none;

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


.form-field input::placeholder,
.form-field textarea::placeholder{
    color:
        rgba(243,241,235,.3);
}


.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{
    border-color:
        rgba(184,137,63,.55);

    background:
        rgba(184,137,63,.035);

    box-shadow:
        0 0 0 4px
        rgba(184,137,63,.06),

        0 0 30px
        rgba(184,137,63,.05);
}


.form-field textarea{
    resize:vertical;

    min-height:170px;
}


.form-footer{
    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:25px;

    flex-wrap:wrap;

    margin-top:10px;
}


.form-footer p{
    margin:0;

    max-width:500px;

    font-size:.8rem;

    color:
        rgba(243,241,235,.38);
}


/* ========================================================= */
/* 12 — CHAT GATEWAY                                         */
/* ========================================================= */

.ars-chat-gateway{
    background:
        radial-gradient(
            ellipse at 50% 20%,
            rgba(29,57,91,.08),
            transparent 45%
        );
}


.chat-grid{
    display:grid;

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

    gap:18px;
}


.chat-card{
    min-height:350px;

    padding:35px;

    display:flex;

    flex-direction:column;

    border-radius:
        30px
        70px
        30px
        70px;

    transition:
        transform .5s
        cubic-bezier(.16,1,.3,1),

        border-color .4s,

        box-shadow .5s;
}


.chat-card:hover{
    transform:
        translateY(-12px);

    border-color:
        rgba(184,137,63,.32);

    box-shadow:
        0 30px 70px
        rgba(0,0,0,.4);
}


.chat-card .card-number{
    margin-bottom:auto;
}


.chat-card h3{
    font-size:1.45rem;

    margin:
        35px
        0
        12px;
}


.chat-card p{
    color:
        rgba(243,241,235,.52);

    line-height:1.8;

    margin:
        0
        0
        25px;
}


/* ========================================================= */
/* 13 — CONTACT                                               */
/* ========================================================= */

.contact-grid{
    display:grid;

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

    gap:16px;
}


.contact-card{
    min-height:300px;

    padding:30px;

    display:flex;

    flex-direction:column;

    border-radius:
        28px
        28px
        65px
        28px;

    transition:
        transform .45s,
        border-color .4s;
}


.contact-card:hover{
    transform:translateY(-8px);

    border-color:
        rgba(184,137,63,.3);
}


.contact-icon{
    width:52px;
    height:52px;

    display:flex;

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

    border-radius:50%;

    color:#d7b66e;

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

    margin-bottom:auto;
}


.contact-card h3{
    font-size:1.2rem;

    margin:
        35px
        0
        10px;
}


.contact-card p{
    color:
        rgba(243,241,235,.5);

    line-height:1.75;

    font-size:.88rem;

    margin:
        0
        18px;
}


.contact-link{
    word-break:break-word;
}


/* ========================================================= */
/* 14 — FINAL PROMISE                                        */
/* ========================================================= */

.open-door-final{
    padding-bottom:
        clamp(100px,14vw,200px);
}


.final-promise{
    position:relative;

    max-width:1100px;

    margin:auto;

    padding:
        clamp(50px,8vw,110px);

    text-align:center;

    border-radius:
        120px
        40px
        120px
        40px;

    overflow:hidden;
}


.final-promise::before{
    content:"";

    position:absolute;

    width:500px;
    height:500px;

    left:50%;
    top:50%;

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

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(184,137,63,.1),
            transparent 65%
        );

    filter:blur(25px);

    pointer-events:none;
}


.final-promise > *{
    position:relative;
    z-index:2;
}


.final-promise h2{
    max-width:850px;

    margin:
        22px
        auto
        28px;

    font-size:
        clamp(2.4rem,5vw,5.5rem);

    line-height:.98;

    letter-spacing:-.055em;
}


.final-promise p{
    max-width:750px;

    margin:
        0
        auto
        20px;

    color:
        rgba(243,241,235,.58);

    line-height:1.9;
}


.promise-line{
    width:
        min(300px,60%);

    height:1px;

    margin:
        45px
        auto
        30px;

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


.final-promise h3{
    margin:
        0
        0
        30px;

    font-size:1.8rem;

    color:#d7b66e;
}


/* ========================================================= */
/* 15 — FOOTER                                                */
/* ========================================================= */

.ars-open-door-footer{
    padding:
        70px
        0
        35px;

    border-top:
        1px solid
        rgba(255,255,255,.07);

    background:
        rgba(0,0,0,.3);
}


.footer-brand{
    text-align:center;

    max-width:650px;

    margin:
        0
        auto
        45px;
}


.footer-brand h2{
    margin:
        15px
        0;

    font-size:
        clamp(1.8rem,3vw,3rem);
}


.footer-brand p{
    color:
        rgba(243,241,235,.45);
}


.footer-navigation{
    display:flex;

    justify-content:center;

    flex-wrap:wrap;

    gap:
        12px
        28px;

    padding:
        25px
        0;

    border-top:
        1px solid
        rgba(255,255,255,.06);

    border-bottom:
        1px solid
        rgba(255,255,255,.06);
}


.footer-navigation a{
    color:
        rgba(243,241,235,.55);

    text-decoration:none;

    font-size:.85rem;

    transition:
        color .3s;
}


.footer-navigation a:hover{
    color:#d7b66e;
}


.footer-bottom{
    display:flex;

    justify-content:space-between;

    gap:20px;

    flex-wrap:wrap;

    padding-top:25px;

    color:
        rgba(243,241,235,.3);

    font-size:.75rem;
}


/* ========================================================= */
/* 16 — ACCESSIBILITY                                        */
/* ========================================================= */

.ars-open-door a:focus-visible,
.ars-open-door button:focus-visible,
.ars-open-door input:focus-visible,
.ars-open-door select:focus-visible,
.ars-open-door textarea:focus-visible{
    outline:
        2px solid
        rgba(184,137,63,.8);

    outline-offset:4px;
}


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

@media (max-width:1100px){

    .open-door-hero{
        grid-template-columns:1fr;

        text-align:center;

        padding-top:130px;
    }


    .open-door-hero-content{
        margin:auto;
    }


    .open-door-hero-content > p{
        margin-left:auto;
        margin-right:auto;
    }


    .open-door-actions{
        justify-content:center;
    }


    .open-door-visual{
        width:
            min(100%,650px);

        margin:auto;

        min-height:520px;
    }


    .connection-grid{
        grid-template-columns:
            repeat(2,1fr);
    }


    .contact-grid{
        grid-template-columns:
            repeat(2,1fr);
    }


    .chat-grid{
        grid-template-columns:
            repeat(2,1fr);
    }


    .chat-card:last-child{
        grid-column:
            1 / -1;
    }

}


/* ========================================================= */
/* 18 — TABLET / SMALL LAPTOP                                */
/* ========================================================= */

@media (max-width:900px){

    .global-panel,
    .founder-panel,
    .community-panel,
    .message-gateway{
        grid-template-columns:1fr;
    }


    .global-visual{
        width:
            min(100%,480px);

        margin:auto;
    }


    .founder-symbol{
        order:1;
    }


    .founder-content{
        order:2;
    }


    .community-visual{
        min-height:360px;
    }


    .message-gateway{
        text-align:center;
    }


    .gateway-core{
        margin-bottom:20px;
    }


    .gateway-options{
        text-align:left;
    }

}


/* ========================================================= */
/* 19 — MOBILE                                               */
/* ========================================================= */

@media (max-width:700px){

    .ars-open-door{
        overflow-x:hidden;
    }


    .open-door-hero{
        min-height:auto;

        padding:
            120px
            20px
            80px;
    }


    .open-door-hero h1{
        font-size:
            clamp(2.8rem,14vw,5rem);
    }


    .open-door-hero .hero-lead{
        font-size:1.05rem;
    }


    .open-door-actions{
        flex-direction:column;

        align-items:stretch;
    }


    .open-door-actions .ars-button{
        width:100%;
    }


    .open-door-visual{
        min-height:
            min(115vw,500px);

        border-radius:
            35px
            90px
            35px
            90px;
    }


    .connection-grid,
    .contact-grid,
    .chat-grid{
        grid-template-columns:1fr;
    }


    .chat-card:last-child{
        grid-column:auto;
    }


    .global-cards,
    .founder-options,
    .human-values,
    .community-cards,
    .gateway-options{
        grid-template-columns:1fr;
    }


    .global-panel,
    .founder-panel,
    .community-panel,
    .message-gateway,
    .message-form-panel,
    .human-message,
    .final-promise{
        border-radius:
            30px
            60px
            30px
            60px;
    }


    .founder-orb{
        width:
            min(80vw,340px);
    }


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


    .form-footer{
        flex-direction:column;

        align-items:stretch;
    }


    .form-footer .ars-button{
        width:100%;
    }


    .contact-card{
        min-height:260px;
    }


    .footer-bottom{
        flex-direction:column;

        text-align:center;

        align-items:center;
    }

}


/* ========================================================= */
/* 20 — SMALL MOBILE                                         */
/* ========================================================= */

@media (max-width:420px){

    .open-door-hero{
        padding-left:16px;
        padding-right:16px;
    }


    .open-door-visual{
        min-height:400px;
    }


    .connection-card,
    .chat-card,
    .contact-card{
        padding:26px;
    }


    .final-promise{
        padding:
            45px
            24px;
    }


    .final-promise h2{
        font-size:2.5rem;
    }


    .language-orb{
        width:210px;
    }


    .language-orb span{
        font-size:4rem;
    }

}


/* ========================================================= */
/* 21 — REDUCED MOTION                                       */
/* ========================================================= */

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

    *,
    *::before,
    *::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        scroll-behavior:auto !important;
        transition-duration:.01ms !important;
    }

                }
/* ========================================================= */
/*                                                         */
/*       END OF ARS GLOBAL VISUAL DNA                      */
/*       START OF ARS COMPANY UNIQUE DESIGN                */
/*                                                         */
/* ========================================================= */