/* Blinker font (jsDelivr / Fontsource static build — no variable axis),
   loaded via includes/partials/fonts.php's preconnect/preload hints.
   Only 400/600/700 are shipped, matching the weights actually used
   (font-normal/font-semibold/font-bold); font-medium (500) falls back
   to the browser's nearest-weight match since Blinker has no 500 cut. */
@font-face {
    font-family: 'Blinker';
    font-style: normal;
    font-display: block;
    font-weight: 400;
    src: url('https://cdn.jsdelivr.net/npm/@fontsource/blinker/files/blinker-latin-400-normal.woff2') format('woff2');
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
    font-family: 'Blinker';
    font-style: normal;
    font-display: block;
    font-weight: 600;
    src: url('https://cdn.jsdelivr.net/npm/@fontsource/blinker/files/blinker-latin-600-normal.woff2') format('woff2');
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
    font-family: 'Blinker';
    font-style: normal;
    font-display: block;
    font-weight: 700;
    src: url('https://cdn.jsdelivr.net/npm/@fontsource/blinker/files/blinker-latin-700-normal.woff2') format('woff2');
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* !important: Tailwind's own Preflight base styles set a font-family on
   html too, at the same specificity — without this it silently wins and
   overrides Blinker. */
html {
    font-family: 'Blinker', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
}

/* Fullscreen map pages (home, embed-map) */
html, body {
    height: 100%;
    margin: 0;
}
body {
    background: #030712;
}
#map {
    position: absolute;
    inset: 0;
}
.mapboxgl-ctrl-logo {
    opacity: 0.6;
}
.mapboxgl-marker {
    cursor: pointer;
}
.mapboxgl-popup-close-button {
    color: #111827;
    padding-left: 4px;
    padding-right: 4px;
}

/* flag-icons country flags — consistent alignment/spacing next to text
   everywhere they're used (was 3 slightly different inline styles before
   the JS consolidation; harmless in flex contexts since vertical-align is
   ignored there). */
.fi {
    vertical-align: middle;
    margin-right: 0.35em;
}

/* Page chrome: dotted grid background + glow, logo gradient */
.bg-grid-glow {
    position: relative;
    isolation: isolate;
}
.bg-grid-glow::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;

    background-image:
        linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);

    background-size: 60px 60px;

    mask-image: radial-gradient(
        ellipse 70% 55% at 50% 0%,
        black 0%,
        rgba(0, 0, 0, .9) 30%,
        rgba(0, 0, 0, .35) 65%,
        transparent 100%
    );

    -webkit-mask-image: radial-gradient(
        ellipse 70% 55% at 50% 0%,
        black 0%,
        rgba(0, 0, 0, .9) 30%,
        rgba(0, 0, 0, .35) 65%,
        transparent 100%
    );
}
.bg-grid-glow::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    pointer-events: none;

    background: radial-gradient(
        ellipse 60% 40% at 50% 0%,
        rgba(45, 125, 225, .16),
        transparent 70%
    );
}
.logo-text-gradient {
    background-image: linear-gradient(90deg, #ffffff 0%, #ffffff 50%, #96f7e4 50%, #009689 100%);
    background-size: 200% 100%;
    background-position: 0% 0%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    transition: background-position .35s ease;
}
a:hover > .logo-text-gradient {
    background-position: 100% 0%;
}

/* SALSA page telescope-scale scroller */
.salsa-scroll {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.salsa-scroll::-webkit-scrollbar {
    display: none;
}
.salsa-scroll {
    cursor: grab;
}
.salsa-scroll.salsa-dragging {
    cursor: grabbing;
}
.salsa-item {
    transition: transform 0.15s ease;
}
.salsa-item:hover {
    transform: translateY(-4px);
}
.salsa-ring {
    border-radius: 9999px;
    border: 3px solid transparent;
    background-image: linear-gradient(#030712, #030712), linear-gradient(90deg, #96f7e4, #009689);
    background-origin: border-box;
    background-clip: padding-box, border-box;
}
.salsa-fill {
    border-radius: 9999px;
    background: linear-gradient(90deg, #96f7e4, #009689);
}