/* =========================================================
   AURION ROMANIA
   CONCEPT FIDELITY LAYER
   Reper: conceptul vizual aprobat
========================================================= */

:root {
    --concept-max: 1440px;
    --concept-side: 58px;
}


/* ---------------------------------------------------------
   COMPOZITIE GENERALA
--------------------------------------------------------- */

body {
    background:
        radial-gradient(
            ellipse at 67% 33%,
            rgba(8, 67, 118, .13),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            #02070d 0%,
            #020912 58%,
            #02070d 100%
        );
}

.container {
    width: min(
        calc(100% - (var(--concept-side) * 2)),
        var(--concept-max)
    );
}


/* ---------------------------------------------------------
   HEADER
--------------------------------------------------------- */

.site-header {
    top: 0;
    padding-top: 31px;
}

.header-inner {
    grid-template-columns: 320px 1fr 300px;
}

.brand {
    gap: 6px;
}

.aurion-mark {
    display: block;
    overflow: visible;
    color: #f4fbff;
}

.aurion-mark-header {
    width: 31px;
    height: 24px;

    filter:
        drop-shadow(0 0 5px rgba(115, 208, 255, .22));
}

.brand-name {
    font-size: 22px;
    font-weight: 300;
    letter-spacing: 6px;
}

.brand-country {
    margin-left: 2px;

    color: #8195aa;

    font-size: 13px;
    font-weight: 300;
}

.main-nav {
    gap: 42px;
}

.main-nav a {
    font-size: 13px;
}

.header-cta {
    min-width: 235px;
    justify-content: center;

    padding: 11px 19px;

    font-size: 12px;
}


/* ---------------------------------------------------------
   HERO
--------------------------------------------------------- */

@media (min-width: 1081px) {

    .hero {
        min-height: 548px;
        height: 548px;

        padding-top: 114px;
        padding-bottom: 0;
    }

    .hero-layout {
        grid-template-columns:
            39% 61%;

        min-height: 414px;
        height: 414px;

        gap: 0;
    }

    .hero-content {
        align-self: center;

        padding: 0 0 6px 0;

        transform: none;
    }

    .eyebrow {
        margin-bottom: 18px;

        font-size: 8px;
        letter-spacing: 4.2px;
    }

    .hero-brand {
        margin-bottom: 7px;

        font-size: 44px;
        font-weight: 280;
        letter-spacing: 7px;
    }

    .hero-brand small {
        margin-left: 6px;

        font-size: 24px;
        letter-spacing: 0;
    }

    .hero-title {
        font-size: 53px;
        line-height: .97;
        letter-spacing: -2.4px;
    }

    .hero-description {
        max-width: 485px;

        margin-top: 15px;

        font-size: 13px;
        line-height: 1.43;
    }

    .hero-actions {
        margin-top: 21px;
    }

    .button {
        min-height: 42px;
    }

    .hero-stats {
        margin-top: 25px;
    }

    .stat {
        min-width: 124px;
        padding: 0 24px;
    }

    .stat:first-child {
        padding-left: 7px;
    }

    .stat strong {
        font-size: 21px;
    }


    /* -----------------------------------------------------
       ECOSISTEM
    ----------------------------------------------------- */

    .ecosystem-stage {
        height: 414px;

        transform: translateX(5px);
    }

    .romania-map {
        top: 35px;
        left: 49%;

        width: 500px;
        height: 365px;

        opacity: .62;

        filter:
            drop-shadow(0 0 9px rgba(56, 166, 235, .22))
            drop-shadow(0 0 48px rgba(15, 90, 155, .12));
    }

    .aurion-core {
        top: 50%;
        left: 49%;

        width: 190px;
        height: 190px;
    }

    .aurion-mark-core {
        width: 72px;
        height: 45px;

        margin-bottom: 3px;

        filter:
            drop-shadow(0 0 7px rgba(145, 225, 255, .7))
            drop-shadow(0 0 20px rgba(66, 174, 255, .46));
    }

    .core-content strong {
        font-size: 18px;
        letter-spacing: 6px;
    }

    .core-content span {
        margin-top: 4px;

        font-size: 11px;
    }


    /* -----------------------------------------------------
       NODURI
    ----------------------------------------------------- */

    .node-icon {
        width: 53px;
        height: 53px;

        padding: 14px;
    }

    .node-icon svg {
        width: 100%;
        height: 100%;

        fill: none;
        stroke: currentColor;
        stroke-width: 1.65;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .project-node {
        max-width: 188px;
    }

    .project-node strong {
        margin-bottom: 3px;

        font-size: 11.5px;
    }

    .project-node span {
        font-size: 9px;
        line-height: 1.32;
    }

    .node-ai {
        top: 0;
        left: 86px;
    }

    .node-taxi {
        top: 128px;
        left: -1px;
    }

    .node-search {
        bottom: 2px;
        left: 72px;
    }

    .node-programari {
        top: 1px;
        right: 100px;
    }

    .node-localpass {
        top: 128px;
        right: 6px;
    }

    .node-commercial {
        right: 53px;
        bottom: 5px;
    }


    /* -----------------------------------------------------
       MESAJ VERTICAL DIN DREAPTA
    ----------------------------------------------------- */

    .hero-side-message {
        position: absolute;

        z-index: 20;

        top: 63px;
        right: -42px;

        display: flex;
        flex-direction: column;

        width: 115px;

        color: #728ca4;

        font-size: 8px;
        font-weight: 500;
        line-height: 1.7;
        letter-spacing: 3.1px;

        pointer-events: none;
    }

    .hero-side-message::after {
        content: "";

        display: block;

        width: 66px;
        height: 1px;

        margin-top: 8px;

        background:
            linear-gradient(
                90deg,
                rgba(77, 172, 232, .48),
                transparent
            );
    }
}


/* ---------------------------------------------------------
   PROJECT PANEL
--------------------------------------------------------- */

.projects-section {
    position: relative;

    width: calc(100% - 2px);

    margin: 0 auto;

    padding: 22px 0 25px;

    border:
        1px solid rgba(69, 132, 177, .16);

    border-bottom: 0;

    border-radius:
        23px 23px 0 0;

    background:
        linear-gradient(
            180deg,
            rgba(3, 11, 19, .98),
            rgba(2, 8, 14, 1)
        );

    box-shadow:
        inset 0 1px 0 rgba(111, 195, 248, .025);
}

.projects-section::before {
    display: none;
}

.section-heading {
    grid-template-columns:
        1fr 390px;

    align-items: end;

    gap: 50px;

    margin-bottom: 17px;
}

.section-eyebrow {
    font-size: 8px;
    letter-spacing: 4.3px;
}

.section-heading h2 {
    margin-top: 6px;

    font-size: 30px;
    font-weight: 280;
    letter-spacing: -1px;
}

.projects-heading-side {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    padding-bottom: 2px;
}

.projects-heading-side p {
    max-width: 365px;

    margin: 0;

    color: #8da0b3;

    font-size: 10px;
    line-height: 1.35;
}

.projects-all-link {
    align-self: flex-end;

    display: inline-flex;
    align-items: center;

    gap: 8px;

    margin-top: 5px;

    color: #8bcbea;

    font-size: 9px;

    border-bottom:
        1px solid rgba(105, 190, 235, .25);
}

.project-grid {
    grid-template-columns: repeat(6, 1fr);

    gap: 9px;
}

.project-card {
    min-height: 137px;

    padding: 14px;

    border-radius: 7px;

    background:
        linear-gradient(
            145deg,
            rgba(10, 27, 42, .95),
            rgba(4, 13, 22, .97)
        );

    box-shadow: none;
}

.project-card .card-icon {
    width: 25px;
    height: 25px;

    margin-bottom: 9px;
}

.project-card h3 {
    margin-bottom: 5px;

    font-size: 10px;
}

.project-card p {
    max-width: 135px;
    min-height: 27px;

    font-size: 8.5px;
}

.project-card a {
    width: 21px;
    height: 21px;

    margin-top: 7px;

    font-size: 11px;
}


/* ---------------------------------------------------------
   EVITĂ ELEMENTELE PROTOTIP CARE NU EXISTĂ ÎN CONCEPT
--------------------------------------------------------- */

.project-card:hover {
    transform: translateY(-2px);
}


/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */

@media (max-width: 1320px) and (min-width: 1081px) {
    :root {
        --concept-side: 38px;
    }

    .header-inner {
        grid-template-columns:
            270px 1fr 250px;
    }

    .main-nav {
        gap: 27px;
    }

    .hero-side-message {
        display: none;
    }
}

@media (max-width: 1080px) {
    .hero-side-message {
        display: none;
    }

    .aurion-mark-header {
        width: 27px;
    }

    .project-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 760px) {
    .project-grid {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   CONCEPT FIDELITY PASS 02
   Geometrie principala dupa conceptul aprobat
========================================================= */


/* ---------------------------------------------------------
   WORDMARK AURION
--------------------------------------------------------- */

.brand {
    gap: 0;
}

.aurion-mark-header {
    width: 28px;
    height: 23px;

    margin-right: -1px;
}

.brand-name {
    margin-left: 0;

    font-size: 22px;
    font-weight: 300;
    letter-spacing: 6px;
}

.brand-country {
    margin-left: 10px;
}


.hero-wordmark {
    display: flex !important;
    align-items: center;

    width: max-content;

    gap: 0;

    letter-spacing: 0 !important;
}

.aurion-mark-hero {
    flex: 0 0 auto;

    width: 52px;
    height: 34px;

    margin-right: -2px;

    color: #f5fbff;

    filter:
        drop-shadow(0 0 5px rgba(139, 218, 255, .24));
}

.hero-wordmark-text {
    font-size: inherit;
    font-weight: 280;
    letter-spacing: 7px;
}

.hero-wordmark small {
    margin-left: 14px !important;
}


/* ---------------------------------------------------------
   DESKTOP — GEOMETRIE HERO
--------------------------------------------------------- */

@media (min-width: 1081px) {

    /*
       Conceptul este mai compact.
       Sectiunea proiectelor trebuie sa intre vizibil
       in primul viewport.
    */

    .hero {
        min-height: 505px;
        height: 505px;

        padding-top: 105px;
        padding-bottom: 0;
    }

    .hero-layout {
        min-height: 380px;
        height: 380px;

        grid-template-columns:
            38.5% 61.5%;
    }


    /* -----------------------------------------------------
       TEXT STANGA
    ----------------------------------------------------- */

    .hero-content {
        align-self: start;

        padding-top: 23px;
    }

    .eyebrow {
        margin-bottom: 17px;
    }

    .hero-brand {
        margin-bottom: 9px;

        font-size: 43px;
    }

    .hero-title {
        font-size: 52px;
        line-height: .98;
    }

    .hero-description {
        max-width: 490px;

        margin-top: 15px;
    }

    .hero-actions {
        margin-top: 19px;
    }

    .hero-stats {
        margin-top: 22px;
    }


    /* -----------------------------------------------------
       ECOSISTEM DREAPTA
    ----------------------------------------------------- */

    .ecosystem-stage {
        height: 380px;

        transform: translateX(7px);
    }

    .romania-map {
        top: 28px;
        left: 49%;

        width: 475px;
        height: 340px;
    }

    .aurion-core {
        top: 53%;
        left: 49%;

        width: 188px;
        height: 188px;
    }


    /* -----------------------------------------------------
       NODURI — 3 STANGA / 3 DREAPTA
       Fara coliziune cu navigatia
    ----------------------------------------------------- */

    .node-ai {
        top: 48px;
        left: 78px;
    }

    .node-taxi {
        top: 158px;
        left: -4px;
    }

    .node-search {
        left: 68px;
        bottom: -1px;
    }

    .node-programari {
        top: 48px;
        right: 92px;
    }

    .node-localpass {
        top: 158px;
        right: 0;
    }

    .node-commercial {
        right: 48px;
        bottom: -1px;
    }


    /* -----------------------------------------------------
       TAGLINE DREAPTA
    ----------------------------------------------------- */

    .hero-side-message {
        top: 54px;
        right: -39px;

        width: 112px;
    }


    /* -----------------------------------------------------
       PANOU PROIECTE
    ----------------------------------------------------- */

    .projects-section {
        padding-top: 20px;
    }

    .section-heading {
        margin-bottom: 15px;
    }

    .project-card {
        min-height: 142px;
    }
}


/* ---------------------------------------------------------
   LINIUTE SI ELEMENTE DIN CONCEPT
--------------------------------------------------------- */

.hero-side-message {
    text-transform: uppercase;
}

.hero-side-message span {
    white-space: nowrap;
}


/* ---------------------------------------------------------
   HEADER MEREU DEASUPRA ECOSISTEMULUI
--------------------------------------------------------- */

.site-header {
    z-index: 100;
}

.ecosystem-stage {
    z-index: 1;
}


/* =========================================================
   CONCEPT FIDELITY PASS 03
   Aliniere geometrica dupa comparatie directa
   concept aprobat vs preview real
========================================================= */

@media (min-width: 1081px) {

    /* -----------------------------------------------------
       HEADER
       In concept headerul este mai aproape de marginea de sus
    ----------------------------------------------------- */

    .site-header {
        padding-top: 12px;
    }


    /* Acasa este pagina activa in concept */

    .main-nav a:first-child {
        color: #ffffff;
    }

    .main-nav a:first-child::after {
        width: 100%;
    }


    /* -----------------------------------------------------
       HERO
       Pastram aceeasi inaltime totala pentru ca panoul de
       proiecte este deja pozitionat corect.
       Mutam doar continutul intern in sus.
    ----------------------------------------------------- */

    .hero {
        min-height: 505px;
        height: 505px;

        padding-top: 70px;
        padding-bottom: 0;
    }

    .hero-layout {
        min-height: 380px;
        height: 380px;

        grid-template-columns:
            38.5% 61.5%;

        align-items: start;
    }


    /* -----------------------------------------------------
       COLOANA STANGA
    ----------------------------------------------------- */

    .hero-content {
        align-self: start;

        padding-top: 23px;

        transform: none;
    }

    .eyebrow {
        margin-bottom: 17px;
    }

    .hero-wordmark {
        margin-bottom: 8px;
    }

    .hero-title {
        font-size: 52px;
        line-height: .98;
    }

    .hero-description {
        max-width: 475px;

        margin-top: 14px;
    }

    .hero-actions {
        margin-top: 19px;
    }

    .hero-stats {
        margin-top: 22px;
    }


    /* -----------------------------------------------------
       ECOSISTEM
       Conceptul are graficul mai compact pe orizontala.
       Marginea stanga ramane aproape pe loc, iar partea
       dreapta este trasa spre nucleu.
    ----------------------------------------------------- */

    .ecosystem-stage {
        justify-self: start;

        width: 780px;
        max-width: none;
        height: 380px;

        transform: none;
    }


    /* -----------------------------------------------------
       HARTA ROMANIEI
       Mai mare decat in preview si extinsa in spatele
       intregului nucleu, asemenea conceptului.
    ----------------------------------------------------- */

    .romania-map {
        top: -1px;
        left: 44%;

        width: 720px;
        height: 405px;

        opacity: .66;

        transform: translateX(-50%);

        filter:
            drop-shadow(0 0 9px rgba(62, 178, 245, .25))
            drop-shadow(0 0 50px rgba(15, 91, 160, .14));
    }


    /* -----------------------------------------------------
       NUCLEU
       Mai aproape de centrul paginii, putin mai mare.
    ----------------------------------------------------- */

    .aurion-core {
        top: 47%;
        left: 44%;

        width: 205px;
        height: 205px;
    }

    .aurion-core::before {
        inset: -18px;
    }

    .aurion-core::after {
        inset: -39px;
    }

    .core-ring-outer {
        inset: -23px;
    }

    .aurion-mark-core {
        width: 77px;
        height: 48px;
    }

    .core-content strong {
        font-size: 19px;
    }


    /* -----------------------------------------------------
       NODURI STANGA
       Aproape de geometria conceptului.
    ----------------------------------------------------- */

    .node-ai {
        top: 12px;
        left: 78px;
    }

    .node-taxi {
        top: 151px;
        left: -3px;
    }

    .node-search {
        left: 67px;
        bottom: 0;
    }


    /* -----------------------------------------------------
       NODURI DREAPTA
       Programari trebuie mult mai aproape de nucleu,
       LocalPass ramane mai exterior.
    ----------------------------------------------------- */

    .node-programari {
        top: 12px;
        right: 112px;
    }

    .node-localpass {
        top: 151px;
        right: -55px;
    }

    .node-commercial {
        right: 55px;
        bottom: 0;
    }


    /* cercurile nodurilor sunt putin mai mari in concept */

    .node-icon {
        width: 58px;
        height: 58px;

        padding: 15px;
    }

    .project-node strong {
        font-size: 12px;
    }

    .project-node span {
        font-size: 9px;
    }


    /* -----------------------------------------------------
       MESAJ DREAPTA
    ----------------------------------------------------- */

    .hero-side-message {
        top: 49px;
        right: -29px;
    }


    /* -----------------------------------------------------
       LUMINA CENTRALA URMEAZA NOUA POZITIE A NUCLEULUI
    ----------------------------------------------------- */

    .ecosystem-stage::before {
        top: 47%;
        left: 44%;
    }

    .ecosystem-stage::after {
        top: 47%;
        left: 44%;
    }
}


/* =========================================================
   CONCEPT FIDELITY PASS 04
   Romania nocturna + infrastructura energetica
========================================================= */


/* ---------------------------------------------------------
   STRATUL NOCTURN AL ROMANIEI
--------------------------------------------------------- */

.romania-night-lights {
    position: absolute;
    z-index: 3;

    top: -1px;
    left: 44%;

    width: 720px;
    height: 405px;

    pointer-events: none;

    transform: translateX(-50%);

    -webkit-mask-image: url("../images/romania-map.svg");
    mask-image: url("../images/romania-map.svg");

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;

    -webkit-mask-position: center;
    mask-position: center;

    -webkit-mask-size: contain;
    mask-size: contain;

    opacity: .92;

    background:

        /* Bucuresti */
        radial-gradient(
            circle at 72% 72%,
            rgba(255, 198, 107, .95) 0 1px,
            rgba(255, 178, 75, .48) 2px,
            transparent 7px
        ),

        /* Constanta */
        radial-gradient(
            circle at 88% 69%,
            rgba(255, 202, 116, .88) 0 1px,
            rgba(255, 176, 76, .35) 2px,
            transparent 6px
        ),

        /* Iasi */
        radial-gradient(
            circle at 80% 31%,
            rgba(255, 200, 111, .84) 0 1px,
            rgba(255, 173, 68, .32) 2px,
            transparent 6px
        ),

        /* Cluj */
        radial-gradient(
            circle at 38% 35%,
            rgba(255, 192, 96, .80) 0 1px,
            rgba(255, 165, 62, .30) 2px,
            transparent 6px
        ),

        /* Timisoara */
        radial-gradient(
            circle at 15% 57%,
            rgba(255, 196, 100, .82) 0 1px,
            rgba(255, 165, 62, .29) 2px,
            transparent 6px
        ),

        /* Brasov */
        radial-gradient(
            circle at 57% 51%,
            rgba(255, 207, 125, .78) 0 1px,
            rgba(255, 172, 72, .26) 2px,
            transparent 5px
        ),

        /* Craiova */
        radial-gradient(
            circle at 44% 72%,
            rgba(255, 192, 95, .72) 0 1px,
            rgba(255, 164, 63, .25) 2px,
            transparent 5px
        ),

        /* Oradea */
        radial-gradient(
            circle at 23% 30%,
            rgba(255, 200, 112, .68) 0 1px,
            transparent 5px
        ),

        /* Sibiu */
        radial-gradient(
            circle at 46% 52%,
            rgba(255, 199, 108, .65) 0 1px,
            transparent 5px
        ),

        /* retea albastra generala */
        radial-gradient(
            circle,
            rgba(104, 209, 255, .72) 0 1px,
            transparent 1.6px
        );

    background-size:
        auto,
        auto,
        auto,
        auto,
        auto,
        auto,
        auto,
        auto,
        auto,
        31px 31px;

    filter:
        drop-shadow(0 0 6px rgba(86, 193, 255, .18));
}


/* infrastructura fina dintre puncte */

.romania-night-lights::before {
    content: "";

    position: absolute;
    inset: 0;

    opacity: .44;

    background:
        linear-gradient(
            24deg,
            transparent 42%,
            rgba(87, 194, 255, .23) 42.4%,
            transparent 42.8%
        ),
        linear-gradient(
            61deg,
            transparent 46%,
            rgba(76, 180, 244, .20) 46.4%,
            transparent 46.8%
        ),
        linear-gradient(
            103deg,
            transparent 53%,
            rgba(82, 192, 255, .18) 53.4%,
            transparent 53.8%
        ),
        linear-gradient(
            141deg,
            transparent 38%,
            rgba(69, 172, 238, .20) 38.4%,
            transparent 38.8%
        ),
        linear-gradient(
            163deg,
            transparent 59%,
            rgba(95, 202, 255, .17) 59.4%,
            transparent 59.8%
        );
}


/* puls foarte fin al luminilor */

.romania-night-lights::after {
    content: "";

    position: absolute;
    inset: 0;

    background:
        radial-gradient(
            circle at 72% 72%,
            rgba(255, 185, 82, .20),
            transparent 8%
        ),
        radial-gradient(
            circle at 48% 48%,
            rgba(67, 178, 247, .13),
            transparent 35%
        );

    animation:
        aurionRomaniaNightPulse 5.8s ease-in-out infinite;
}

@keyframes aurionRomaniaNightPulse {
    0%,
    100% {
        opacity: .45;
    }

    50% {
        opacity: 1;
    }
}


/* ---------------------------------------------------------
   CONEXIUNI CA FIBRE / ENERGIE
--------------------------------------------------------- */

.connection-thread {
    fill: none;

    stroke-linecap: round;
    stroke-linejoin: round;

    pointer-events: none;
}

.connection-thread-a {
    stroke:
        rgba(100, 203, 255, .54);

    stroke-width: .72;

    opacity: .72;

    filter:
        url(#aurionOrganicA);
}

.connection-thread-b {
    stroke:
        rgba(166, 229, 255, .31);

    stroke-width: .52;

    opacity: .62;

    filter:
        url(#aurionOrganicB);
}


/* linia centrala nu mai domina vizual */

.connection-base {
    stroke:
        rgba(87, 191, 249, .31);

    stroke-width: .78;

    opacity: .72;

    filter:
        url(#aurionOrganicA);
}


/* haloul devine mai fin si mai natural */

.connection-glow {
    stroke:
        rgba(91, 197, 255, .19);

    stroke-width: 3.4;

    opacity: .58;

    filter:
        url(#aurionOrganicB);
}


/* impulsuri mici care circula prin fibre */

.connection-pulse {
    stroke:
        rgba(226, 248, 255, .96);

    stroke-width: 1.35;

    stroke-dasharray:
        4 18 2 106;

    opacity: .92;

    filter:
        url(#aurionOrganicA);

    animation:
        aurionOrganicTravel 6.7s linear infinite;
}

.connection-pulse.ai {
    animation-delay: -1.1s;
}

.connection-pulse.taxi {
    animation-delay: -2.7s;
}

.connection-pulse.search {
    animation-delay: -4.1s;
}

.connection-pulse.programari {
    animation-delay: -3.3s;
}

.connection-pulse.localpass {
    animation-delay: -5.0s;
}

.connection-pulse.commercial {
    animation-delay: -1.9s;
}

@keyframes aurionOrganicTravel {
    from {
        stroke-dashoffset: 0;
    }

    to {
        stroke-dashoffset: -260;
    }
}


/* ---------------------------------------------------------
   NUCLEUL TREBUIE SA RAMANA PESTE RETEA
--------------------------------------------------------- */

.aurion-core {
    z-index: 12;
}

.ecosystem-connections {
    z-index: 7;
}

.romania-map {
    z-index: 1;
}


/* ---------------------------------------------------------
   REDUCED MOTION
--------------------------------------------------------- */

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

    .romania-night-lights::after,
    .connection-pulse {
        animation: none !important;
    }
}


/* =========================================================
   CONCEPT FIDELITY PASS 06
   Corectie Pass 05:
   Romania vizibila + 6 fascicule controlate
========================================================= */


/* vechile raze SVG nu mai sunt folosite */

.ecosystem-connections {
    display: none !important;
}


/* ---------------------------------------------------------
   ROMANIA
--------------------------------------------------------- */

.romania-map {
    opacity: .55 !important;

    background:
        radial-gradient(
            ellipse at 50% 50%,
            rgba(36, 124, 194, .24) 0%,
            rgba(9, 57, 98, .32) 48%,
            rgba(2, 18, 32, .72) 100%
        ) !important;

    filter:
        drop-shadow(
            0 0 9px
            rgba(74, 181, 243, .24)
        )
        drop-shadow(
            0 0 45px
            rgba(22, 105, 176, .12)
        ) !important;
}


/* punctele albastre din harta */

.romania-map::before {
    opacity: .60 !important;

    background-image:
        radial-gradient(
            circle,
            rgba(129, 218, 255, .82) 0 1px,
            transparent 1.7px
        ),
        radial-gradient(
            circle,
            rgba(50, 151, 221, .55) 0 1px,
            transparent 1.7px
        ) !important;

    background-size:
        29px 29px,
        47px 47px !important;

    background-position:
        5px 8px,
        17px 13px !important;
}


/* infrastructura interna foarte fina */

.romania-map::after {
    opacity: .44 !important;

    background:
        linear-gradient(
            24deg,
            transparent 31%,
            rgba(71, 181, 245, .17) 31.4%,
            transparent 31.8%
        ),
        linear-gradient(
            67deg,
            transparent 43%,
            rgba(76, 188, 248, .15) 43.4%,
            transparent 43.8%
        ),
        linear-gradient(
            112deg,
            transparent 53%,
            rgba(85, 193, 251, .15) 53.4%,
            transparent 53.8%
        ),
        linear-gradient(
            148deg,
            transparent 61%,
            rgba(63, 167, 231, .16) 61.4%,
            transparent 61.8%
        ) !important;
}


/* ---------------------------------------------------------
   LUMINILE NOCTURNE
--------------------------------------------------------- */

.romania-night-lights {
    display: block !important;

    z-index: 4;

    opacity: .96 !important;

    mix-blend-mode: screen;
}


/* punctele aurii devin mai vizibile */

.romania-night-lights::before {
    opacity: .52 !important;
}

.romania-night-lights::after {
    opacity: .75;
}


/* ---------------------------------------------------------
   NOILE FASCICULE
--------------------------------------------------------- */

.concept-fibers-v2 {
    position: absolute;

    z-index: 8;

    inset: 0;

    width: 100%;
    height: 100%;

    overflow: visible;

    pointer-events: none;

    mix-blend-mode: screen;
}

.concept-fibers-v2 path {
    fill: none;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* halo foarte discret */

.fiber-v2-halo {
    stroke:
        rgba(50, 166, 235, .17);

    stroke-width: 5.5;

    filter:
        url(#fiberWideGlowV2);
}


/* fir principal */

.fiber-v2-line {
    stroke:
        rgba(102, 204, 255, .55);

    stroke-width: .95;

    opacity: .88;

    filter:
        url(#fiberGlowV2);
}


/* fire secundare */

.fiber-v2-secondary {
    stroke:
        rgba(157, 225, 255, .30);

    stroke-width: .48;

    opacity: .82;
}


/* puls energetic */

.fiber-v2-pulse {
    stroke:
        rgba(236, 250, 255, .98);

    stroke-width: 1.45;

    stroke-dasharray:
        7 17 2 125;

    filter:
        url(#fiberGlowV2);

    animation:
        aurionFiberV2Travel
        7.2s linear infinite;
}

.fiber-v2-bundle:nth-of-type(2)
.fiber-v2-pulse {
    animation-delay: -1.4s;
}

.fiber-v2-bundle:nth-of-type(3)
.fiber-v2-pulse {
    animation-delay: -2.7s;
}

.fiber-v2-bundle:nth-of-type(4)
.fiber-v2-pulse {
    animation-delay: -3.9s;
}

.fiber-v2-bundle:nth-of-type(5)
.fiber-v2-pulse {
    animation-delay: -5.1s;
}

.fiber-v2-bundle:nth-of-type(6)
.fiber-v2-pulse {
    animation-delay: -6.2s;
}


@keyframes aurionFiberV2Travel {
    from {
        stroke-dashoffset: 0;
    }

    to {
        stroke-dashoffset: -310;
    }
}


/* ---------------------------------------------------------
   STRATIFICARE
--------------------------------------------------------- */

.romania-map {
    z-index: 1;
}

.romania-night-lights {
    z-index: 4;
}

.concept-fibers-v2 {
    z-index: 8;
}

.aurion-core {
    z-index: 12;
}

.project-node {
    z-index: 15;
}


/* ---------------------------------------------------------
   PUNCTE CALDE SUPLIMENTARE
--------------------------------------------------------- */

.ecosystem-stage {
    background:
        radial-gradient(
            circle at 58% 27%,
            rgba(255, 186, 81, .12) 0 1px,
            transparent 4px
        ),
        radial-gradient(
            circle at 66% 44%,
            rgba(255, 177, 66, .11) 0 1px,
            transparent 4px
        ),
        radial-gradient(
            circle at 54% 72%,
            rgba(255, 193, 91, .10) 0 1px,
            transparent 4px
        ),
        radial-gradient(
            circle at 31% 63%,
            rgba(255, 172, 61, .08) 0 1px,
            transparent 4px
        );
}


/* ---------------------------------------------------------
   REDUCED MOTION
--------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .fiber-v2-pulse {
        animation: none !important;
    }
}