:root{
  --bg: #05040a;
  --hero-bg: #1a0b2a;
  --ink: #f1dfff;
  --steel: rgba(241, 223, 255, 0.08);
  --bar: rgba(255, 255, 255, 0.12);

  --card: rgba(255, 255, 255, 0.04);
  --card2: rgba(255, 255, 255, 0.06);
  --cardBorder: rgba(255, 255, 255, 0.08);

  --container: 1180px;
}

*{ box-sizing: border-box; }
html, body { height: 100%; }

body{
  margin: 0;
  font-family: "Oswald", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: #05040a;
  color: var(--ink);
  overflow-x: hidden;
  position: relative;
}

#particles{
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

#particles canvas{
  width: 100%;
  height: 100%;
  display: block;
  background: transparent;
}

.background-layer{
  position: fixed;
  inset: 0;
  z-index: -2;
  background: radial-gradient(
    1200px 700px at 30% 25%,
    #1a0b2a 0%,
    #0b0614 45%,
    #05040a 100%
  );
}

header,
section{
  position: relative;
  z-index: 1;
}

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

.container{
  width: min(var(--container), calc(100% - 48px));
  margin: 0 auto;
}

html{
  scroll-behavior: smooth;
  scroll-snap-type: y proximity; /* ƒ?T'o. permite salir de la secciÇÎÇZÇζªn 2 sin que te regrese */
}