/* BasTV theme */

:root {
    /* Brand */
    --bt-lime:      #95F301;
    --bt-green:     #12BF21;
    --bt-gradient:  linear-gradient(90deg, var(--bt-lime), var(--bt-green));
    --bt-gradient-soft: linear-gradient(170deg, rgba(149, 243, 1, 0.9), rgba(18, 191, 33), rgba(18, 191, 33, 0.9));

    /* Surfaces */
    --bt-bg:        #000000;
    --bt-surface:   #0d0d0d;
    --bt-surface-2: #161616;

    /* Ink */
    --bt-text:      #ffffff;
    --bt-muted:     rgba(255, 255, 255, 0.62);
    --bt-dim:       rgba(255, 255, 255, 0.38);

    --bt-stroke:      rgba(255, 255, 255, 0.14);
    --bt-stroke-soft: rgba(255, 255, 255, 0.08);
    --bt-stroke-hero: rgba(255, 255, 255, 0.28);
    --bt-glass:       rgba(255, 255, 255, 0.90);

    --bt-radius:    10px;
    --bt-radius-lg: 16px;
    --bt-pill:      999px;

    --bt-shell-x:   clamp(20px, 7vw, 120px);
    --bt-nav-x:     clamp(16px, 3.8vw, 68px);
    --bt-logo-h:    clamp(22px, 5.4vw, 30px);
    --bt-logo-top:  calc((var(--bt-nav-h) - var(--bt-logo-h)) / 2);
    --bt-gap:       14px;
    --bt-nav-h:     clamp(72px, 8vw, 150px);

    --bt-font: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: var(--bt-bg);
    color: var(--bt-text);
    font-family: var(--bt-font);
    -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

[hidden] { display: none !important; }

:focus-visible {
    outline: 2px solid var(--bt-lime);
    outline-offset: 3px;
}

/* Motion */

@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; }
}

/* Large screens */

@media (min-width: 2000px) {
    :root {
        font-size: clamp(16px, 0.8vw, 28px);

        --bt-shell-x: clamp(120px, 6vw, 240px);
        --bt-nav-x:   clamp(68px, 3.4vw, 140px);
        --bt-nav-h:   clamp(150px, 7.5vw, 260px);
        --bt-gap:     clamp(14px, 0.7vw, 28px);
        --bt-logo-h:  clamp(30px, 1.5vw, 58px);
    }
}
