:root {
    --bg: #050308;
    --bg-soft: rgba(255, 255, 255, 0.05);
    --bg-softer: rgba(255, 255, 255, 0.03);
    --line: rgba(255, 255, 255, 0.10);
    --line-strong: rgba(168, 85, 247, 0.28);
    --text: #ffffff;
    --muted: rgba(255, 255, 255, 0.68);
    --muted-2: rgba(255, 255, 255, 0.55);
    --violet: #8b5cf6;
    --violet-2: #a855f7;
    --fuchsia: #d946ef;
    --indigo: #6366f1;
    --white: #ffffff;
    --radius-xl: 28px;
    --radius-2xl: 34px;
    --shadow-glow: 0 0 50px rgba(168, 85, 247, 0.20);
    --shadow-cta: 0 18px 50px rgba(88, 28, 135, 0.28);
    --transition: 0.35s ease;
    --grid: 56px;
    --max: 1280px;

    --panel: rgba(255, 255, 255, 0.05);
    --panel-2: rgba(0, 0, 0, 0.2);
    --emerald: #34d399;
    --amber: #fbbf24;
    --rose: #fb7185;
    --sky: #38bdf8;
    --cyan: #22d3ee;
    --radius-lg: 24px;
    --sidebar: 288px;
}


* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Inter", sans-serif;
    background: var(--bg);
    color: var(--text);
    min-height: 100vh;
    overflow-x: hidden;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
textarea,
select {
    font: inherit;
}

button {
    cursor: pointer;
}

.notiflix-notify {
    top: 90px !important;
    right: 10px !important; /* small clean spacing */
}