/* Fonts (must stay @import and come first) */
@import url('https://fonts.cdnfonts.com/css/univers?styles=70019');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

/* Nav background transition (toggled opaque/transparent in main.js) */
.t-nav { transition: 0.5s background-color; }

/* Mono label treatment used for eyebrows and metadata */
.eyebrow {
    font-family: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
    text-transform: uppercase;
    letter-spacing: 0.2em;
}

/* Tron grid wash, faded toward the edges so it never competes with text */
.grid-wash {
    background-image:
        linear-gradient(to right, rgba(79, 230, 255, 0.05) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(79, 230, 255, 0.05) 1px, transparent 1px);
    background-size: 46px 46px;
    -webkit-mask-image: radial-gradient(ellipse 80% 70% at 30% 30%, #000 0%, transparent 75%);
            mask-image: radial-gradient(ellipse 80% 70% at 30% 30%, #000 0%, transparent 75%);
}

/* Ambient flow-field drift */
@keyframes flow {
    from { transform: translateX(0); }
    to   { transform: translateX(-38px); }
}
.flow { animation: flow 26s ease-in-out infinite alternate; }

@media (prefers-reduced-motion: reduce) {
    .flow { animation: none; }
}

/* Respect users who prefer less motion (disables the smooth anchor scrolling) */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}