/* ===== RESET ===== */

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

html,body{
  height:100%;
}

:root{
  --bg:#0a0910;
  --bg-soft:#111019;
  --panel:#14131d;
  --panel-2:#181621;
  --card:#15141d;

  --border:rgba(255,255,255,.08);
  --border-strong:rgba(255,255,255,.14);

  --text:#f5f2fb;
  --muted:#b7afc9;
  --muted-2:#8f88a4;

  --accent:#8b5cf6;
  --accent-2:#6d28d9;
  --accent-soft:rgba(139,92,246,.16);

  --success:#22c55e;
  --danger:#ef4444;
  --warning:#f59e0b;

  --radius-lg:16px;
  --radius-md:12px;
  --radius-sm:10px;

  --shadow-sm:0 8px 22px rgba(0,0,0,.22);
  --shadow-md:0 14px 34px rgba(0,0,0,.30);
  --shadow-lg:0 22px 54px rgba(0,0,0,.38);

  --container:1280px;
}

body{
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:
    radial-gradient(900px 500px at 50% -10%, rgba(139,92,246,.08), transparent 55%),
    linear-gradient(180deg, #0a0910 0%, #0b0a11 100%);
  color:var(--text);
  line-height:1.55;
  letter-spacing:.01em;
}

/* ===== BASE ===== */

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

img{
  display:block;
  max-width:100%;
}

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

button{
  cursor:pointer;
  border:none;
  background:none;
  color:inherit;
}

input,
select,
textarea{
  appearance:none;
}

/* ===== UTIL ===== */

.container{
  max-width:var(--container);
  margin:auto;
  padding:24px;
}

.section{
  margin-top:40px;
}

.section-title{
  font-size:24px;
  font-weight:800;
  line-height:1.15;
  margin-bottom:16px;
}

.muted{
  color:var(--muted);
}

.no-scroll{
  overflow:hidden;
}

/* ===== TYPOGRAPHY TONE ===== */

h1,h2,h3,h4,h5,h6{
  line-height:1.08;
  letter-spacing:-.02em;
}

strong{
  font-weight:800;
}

/* ===== SELECTION ===== */

::selection{
  background:rgba(139,92,246,.30);
  color:#fff;
}

/* ===== SCROLLBAR ===== */

*{
  scrollbar-width:thin;
  scrollbar-color:#3f345a transparent;
}

*::-webkit-scrollbar{
  width:10px;
  height:10px;
}

*::-webkit-scrollbar-thumb{
  background:#3f345a;
  border-radius:999px;
}

*::-webkit-scrollbar-track{
  background:transparent;
}

@media(max-width:900px){
  .container{
    padding:18px;
  }

  .section{
    margin-top:32px;
  }

  .section-title{
    font-size:22px;
  }
}