body {
margin: 0;
background: #050507;
color: #d1d1d1;
font-family: "Courier New", monospace;
}

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

.banner {
position: relative;
text-align: center;
padding: 60px 20px;
overflow: hidden;
border-bottom: 1px solid #1d1d24;
}

.banner-glow {
position: absolute;
inset: 0;
background:
radial-gradient(
circle,
rgba(124,60,255,.15),
transparent 65%
);
}

.banner h1 {
color: #7c3cff;
letter-spacing: 10px;
font-size: 3rem;
text-shadow:
0 0 10px rgba(124,60,255,.6),
0 0 25px rgba(124,60,255,.3);
}

.subtitle {
color: #8f8f8f;
letter-spacing: 3px;
}

/* ==========================
NAV
========================== */

.nav {
display: flex;
justify-content: center;
gap: 20px;
padding: 12px;
border-bottom: 1px solid #1d1d24;
}

.nav a {
color: #9a9a9a;
text-decoration: none;
transition: .3s;
}

.nav a:hover {
color: #7c3cff;
}

/* ==========================
MAIN
========================== */

.arid-container {
max-width: 900px;
margin: auto;
padding: 50px 20px;
}

/* ==========================
IDENTITY
========================== */

.identity {
text-align: center;
}

.logo-placeholder {
width: 240px;
height: 240px;

margin: 0 auto 30px;

border: 2px dashed #7c3cff;

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

color: #7c3cff;

box-shadow:
    0 0 15px rgba(124,60,255,.25);

}

.identity h2 {
color: #7c3cff;
font-size: 2.5rem;
letter-spacing: 8px;
}

/* ==========================
TAGS
========================== */
.tag-network {
    position: relative;
    margin-top: 30px;
}
.tag-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 12px;

margin-top: 30px;
position: relative;
z-index: 2;
}
.tag {
    position: relative;

    padding: 8px 14px;

    color: #d8c6ff;

    border: 1px solid #7c3cff;

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

    box-shadow: 0 0 10px rgba(124,60,255,.15);

    transition: 0.2s ease;
}

.tag:hover {
    transform: scale(1.05);
    box-shadow: 0 0 18px rgba(124,60,255,.35);
}

.wire-layer{
    position:absolute;

    inset:0;

    width:100%;
    height:100%;

    pointer-events:none;
}


.wire-layer path {
    filter: drop-shadow(0 0 4px rgba(124,60,255,0.4));
}
@keyframes pulseFlow {
    0% {
        stroke-dashoffset: 0;
        opacity: 0.7;
    }

    50% {
        opacity: 1;
    }

    100% {
        stroke-dashoffset: -120;
        opacity: 0.7;
    }
}

.pulse-dot{
    position:fixed;

    width:6px;
    height:6px;

    border-radius:50%;

    background:#b28dff;

    box-shadow:
        0 0 8px #7c3cff,
        0 0 16px #7c3cff,
        0 0 24px #7c3cff;

    pointer-events:none;

    z-index:9999;
}


/* ==========================
QUOTE
========================== */

.quote {
margin-top: 40px;

color: #a68eff;

font-style: italic;

font-size: 1.1rem;

}

/* ==========================
WHY
========================== */

.why-section {
margin-top: 100px;
}

.why-section h2 {
color: #7c3cff;

font-size: 2rem;

letter-spacing: 10px;

text-align: center;

margin-bottom: 40px;

}

.manifesto {
border-left: 3px solid #7c3cff;

padding: 25px;

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

line-height: 1.8;

min-height: 300px;

box-shadow:
    inset 0 0 20px rgba(124,60,255,.05);

}

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

footer {
margin-top: 100px;

text-align: center;

padding: 30px;

color: #555;

border-top: 1px solid #1d1d24;

}