a {
    text-decoration: none;
}


header h1 {
    /* font-family: "stealth57", sans-serif; */
    font-family: "Share Tech Mono", monospace;
    font-size: 2rem;
    color: var(--text-primary);
    text-shadow: 1 1 8px var(--neonGreen), 1 1 8px var(--neonGreen), 0 0 8px var(--neonGreen), 0 0 8px var(--neonGreen);

}




.text-neonGreen {
    color: var(--text-dark);
    text-shadow:
        0 0 calc(2px * var(--pulse)) var(--neonGreen),
        0 0 calc(4px * var(--pulse)) var(--neonGreen),
        0 0 calc(6px * var(--pulse)) var(--neonGreen),
        0 0 calc(18px * var(--pulse)) var(--neonGreen);
}

.text-neonGrey {
    color: var(--text-dark);
    text-shadow:
        0 0 calc(2px * var(--pulse)) var(--neonGrey),
        0 0 calc(4px * var(--pulse)) var(--neonGrey),
        0 0 calc(6px * var(--pulse)) var(--neonGrey),
        0 0 calc(18px * var(--pulse)) var(--neonGrey);
}

.text-neonGrey-subtle {
    color: var(--text-dark);
    text-shadow:
        0 0 calc(6px * 0.1) var(--neonGrey),
        0 0 calc(9px * 0.5) var(--neonGrey);
}

.text-neonWhite {
    color: var(--text-dark);
    text-shadow:
        0 0 calc(2px * var(--pulse)) rgba(235, 235, 235, 1),
        0 0 calc(4px * var(--pulse)) rgba(235, 235, 235, 0.8),
        0 0 calc(6px * var(--pulse)) rgba(235, 235, 235, 0.5),
        0 0 calc(18px * var(--pulse)) rgba(235, 235, 235, 0.2);
}

.text-neonBlue {
    color: var(--text-dark);
    text-shadow:
        0 0 calc(2px * var(--pulse)) var(--neonBlue),
        0 0 calc(4px * var(--pulse)) var(--neonBlue),
        0 0 calc(6px * var(--pulse)) var(--neonBlue),
        0 0 calc(18px * var(--pulse)) var(--neonBlue);
}

.text-neonYellow {
    color: var(--text-dark);
    text-shadow:
        0 0 calc(2px * var(--pulse)) var(--neonYellow),
        0 0 calc(4px * var(--pulse)) var(--neonYellow),
        0 0 calc(6px * var(--pulse)) var(--neonYellow),
        0 0 calc(18px * var(--pulse)) var(--neonYellow);
}

.text-neonYellowSubtle {
    color: var(--text-dark);
    text-shadow:
        0 0 calc(1px * var(--pulse)) var(--neonYellow),
        0 0 calc(2px * var(--pulse)) var(--neonYellow),
        0 0 calc(4px * var(--pulse)) var(--neonYellow);
}

.text-neonPink {
    color: var(--text-dark);
    text-shadow:
        0 0 calc(1px * var(--pulse)) var(--neonPink),
        0 0 calc(1px * var(--pulse)) var(--neonPink),
        0 0 calc(2px * var(--pulse)) var(--neonPink),
        0 0 calc(5px * var(--pulse)) rgba(219, 61, 111, 0.548);
}


.text-neonSubtle {
    color: var(--text-primary);
    text-shadow:
        0 0 calc(2px * var(--pulse)) var(--neonGrey),
        0 0 calc(4px * var(--pulse)) var(--neonGrey),
        0 0 calc(6px * var(--pulse)) var(--neonGrey),
        0 0 calc(18px * var(--pulse)) var(--neonGrey);
}

/* Centered product card */
.product {
    width: 50%;
    margin: 10% auto 0;
    padding: 1.25rem 1.5rem;
    border-radius: 18px;
    text-align: center;
}

.product h3 {
    font-family: "stealth57", sans-serif;
    font-size: 3.5rem;
    line-height: 150%;
    color: var(--text-dark);
    font-family: "stealth57", sans-serif;
    text-shadow: 1 1 8px var(--neonGreen), 1 1 8px var(--neonGreen), 0 0 8px var(--neonGreen), 0 0 8px var(--neonGreen);
}

.product ul {
    list-style: none;
    margin: 0.5rem 0 0 0;
    padding: 0;
}

.product ul li {
    line-height: 200%;
    color: var(--text-secondary);
    font-size: 2rem;
}

.product p {
    line-height: 150%;
    color: var(--text-secondary);
    font-size: 2rem;
}



/* Edge labels hugging sides */
.edge-label {
    position: fixed;
    top: 78%;
    font-size: 1.5em;
    font-family: "stealth57", sans-serif;
    display: flex;
    flex-direction: column;
    text-align: center;
    line-height: 150%;

    width: 19vw;
    height: 19vw;

    border-radius: 50%;

    background: black;

}

.edge-label.left {
    left: 5%;
    color: var(--neonGreen);



}

.edge-label .price {
    font-size: 2em;
    margin-bottom: 20px;
    margin-top: 25px;
}

.edge-label.right {
    right: 5%;
    color: var(--neonBlue);

}






/* White inner glow on the glyphs */
.logo-letter {
    position: relative;
    z-index: 1;
    /* above the smear */
    display: inline-block;
    color: var(--text-dark);
    text-shadow:
        0 0 calc(2px * var(--pulse)) rgb(0, 255, 34),
        0 0 calc(4px * var(--pulse)) rgba(63, 79, 255, 0.85),
        0 0 calc(6px * var(--pulse)) rgba(255, 255, 255, 0.55),
        0 0 calc(12px * var(--pulse)) rgba(255, 255, 255, 0.35);
}

/* The horizontal color smear behind the word */
.logo-word {
    position: relative;
    display: inline-block;
    isolation: isolate;
    /* keep blending contained */
}

.logo-word::before {
    content: "";
    position: absolute;
    inset: 0;
    /* full width */
    top: 50%;
    height: 0.8em;
    /* thin band before squish/blur */
    transform: translateY(-50%) scaleY(0.15);
    /* squish into a line */
    filter: blur(calc(14px * var(--pulse)));
    opacity: 0.95;
    mix-blend-mode: screen;
    /* or try 'lighten' depending on bg */
    pointer-events: none;
    z-index: 0;

    /* One gradient that aligns with letters (10 total, ~10% each). 
     Order: p,o,r (green) | c,h (grey) | L (white) | o (blue) | g (yellow) | i (blue) | c (white) */
    background: linear-gradient(90deg,
            var(--neonGreen) 0%, var(--neonGreen) 30%,
            /* p o r */
            var(--neonGrey) 30%, var(--neonGrey) 50%,
            /* c h   */
            rgba(255, 255, 255, 0.95) 50%, rgba(255, 255, 255, 0.95) 60%,
            /* L */
            var(--neonBlue) 60%, var(--neonBlue) 70%,
            /* o     */
            var(--neonYellow)70%, var(--neonYellow)80%,
            /* g     */
            var(--neonBlue) 80%, var(--neonBlue) 90%,
            /* i     */
            rgba(255, 255, 255, 0.95) 90%, rgba(255, 255, 255, 0.95) 100%
            /* c */
        );
}

/* Optional: soften band edges a touch without changing blur size */
.logo-word::after {
    content: "";
    position: absolute;
    inset: 0;
    top: 50%;
    height: 0.8em;
    transform: translateY(-50%) scaleY(0.35);
    background: radial-gradient(ellipse 100% 60% at 50% 50%, rgba(255, 255, 255, 0.08), transparent 60%);
    filter: blur(12px);
    mix-blend-mode: screen;
    pointer-events: none;
    z-index: 0;
}