@font-face {
  font-family: "AveriaLibre";
  src: url("./../fuentes/AveriaLibre-Regular.ttf");
}
:root {
  /* Fondo y superficie */
  --bg-main: #050814; /* casi negro azulado */
  --bg-elevated: #0d1220; /* tarjetas, secciones */
  --bg-soft: #121829; /* hover suave de tarjetas */

  /* Texto */
  --text-main: #f9fafb; /* texto principal */
  --text-muted: #a9b4d0; /* texto secundario */
  --text-soft: #6c7695; /* etiquetas, placeholders */

  /* Acentos principales (paleta que pasaste) */
  --accent-cyan: #07e6bd; /* My-Color-Theme-1 */
  --accent-blue: #077ee6; /* My-Color-Theme-2 */
  --accent-light: #07c4e6; /* My-Color-Theme-3 */
  --accent-green: #07e672; /* My-Color-Theme-4 */
  --accent-deep: #0737e6; /* My-Color-Theme-5 */
  --accent-sky: #53cfe6; /* My-Color-Theme-6 */

  /* Tonos intermedios / mates */
  --accent-cyan-soft: #39d9c6; /* cyan suavizado */
  --accent-blue-soft: #3b8fe0; /* azul medio */
  --accent-green-soft: #41d97f; /* verde medio */
  --accent-sky-soft: #7ad9ea; /* celeste medio */

  /* Pasteles (fondos, badges) */
  --pastel-cyan: #c5fff1;
  --pastel-blue: #c7e0ff;
  --pastel-green: #c8f9dd;
  --pastel-sky: #d4f6ff;

  /* Contraste puntual (no abusar) */
  --warning: #f97316; /* naranja para detalles / hover fuerte */
  --error: #f43f5e; /* rojo freno (botones peligrosos) */

  /* Bordes y sombras */
  --border-subtle: rgba(148, 163, 184, 0.25);
  --shadow-soft: 0 18px 45px rgba(0, 0, 0, 0.55);
}

html {
  width: 100%;
  min-height: 100%;
  scroll-behavior: smooth;
}
body {
  width: 100%;
  min-height: 100vh;
  margin: 0;
  background: radial-gradient(at 25%, #1a243c 0, var(--bg-main) 45%);
  background-attachment: fixed;
  background-size: cover;
  background-repeat: no-repeat;
  color: var(--text-main);
}

body > * {
  color: var(--text-main);
  width: 100%;
}
main > * {
  padding: 50px;
}

@media (max-width: 968px) {
  body > * {
    text-align: center;
    align-items: center;
  }
  main > *{
    padding:50px;
  }
}
/* Color Theme Swatches in Hex
--My-Color-Theme-1-hex : #446FCA;
--My-Color-Theme-2-hex : #506AA0;
--My-Color-Theme-3-hex : #2A6AF5;
--My-Color-Theme-4-hex : #4F5B75;
--My-Color-Theme-5-hex : #3F424B;
--My-Color-Theme-6-hex : #232833;

Color Theme Swatches in RGBA 
--My-Color-Theme-1-rgba : rgba(68, 111, 202, 1);
--My-Color-Theme-2-rgba : rgba(80, 106, 160, 1);
--My-Color-Theme-3-rgba : rgba(42, 106, 245, 1);
--My-Color-Theme-4-rgba : rgba(79, 91, 117, 1);
--My-Color-Theme-5-rgba : rgba(63, 66, 75, 1);
--My-Color-Theme-6-rgba : rgba(35, 40, 51, 1);

 Color Theme Swatches in HSLA 
--My-Color-Theme-1-hsla : hsla(220, 55, 52, 1);
--My-Color-Theme-2-hsla : hsla(220, 33, 47, 1);
--My-Color-Theme-3-hsla : hsla(221, 91, 56, 1);
--My-Color-Theme-4-hsla : hsla(221, 19, 38, 1);
--My-Color-Theme-5-hsla : hsla(224, 8, 27, 1);
--My-Color-Theme-6-hsla : hsla(221, 18, 16, 1); */