:root{
      --c1:#3D29FF; /* azul/morado */
      --c2:#7F3FFF; /* morado */
      --c3:#8DFF92; /* verde */
      --dark:#0b0b10;
      --card: #ffffff;
      --shadow: 0 10px 30px rgba(0,0,0,.08);
    }
    * { box-sizing: border-box }
    body{
      font-family: "Alan Sans", sans-serif;
      color:#111;
      background:
        radial-gradient(circle at 20% 30%, rgba(141,255,146,.65) 0%, rgba(141,255,146,0) 45%),
        radial-gradient(circle at 80% 70%, rgba(61,41,255,.65) 0%, rgba(61,41,255,0) 55%),
        radial-gradient(circle at 50% 50%, rgba(127,63,255,.55) 0%, rgba(127,63,255,0) 60%),
        linear-gradient(135deg, var(--c1), var(--c2), var(--c3));
      background-blend-mode: screen;
      min-height: 100dvh;
      font-weight: 300;
      font-size: 15px;
    }
    h1,h2,h3,h4,h5,h6{
      font-family: "Parkinsans", sans-serif;
    }
    .parkinsans-<uniquifier> {
      font-family: "Parkinsans", sans-serif;
      font-optical-sizing: auto;
      font-weight: <weight>;
      font-style: normal;
    }

    .alan-sans-<uniquifier> {
      font-family: "Alan Sans", sans-serif;
      font-optical-sizing: auto;
      font-weight: <weight>;
      font-style: normal;
    }

    /* Navbar */
    .navbar-brand{ font-weight:800; letter-spacing:.5px }
    .btn-primary{
      --bs-btn-bg: #8dff92;
      color: #3d29ff;
      --bs-btn-border-color: var(--c2);
      --bs-btn-hover-bg: var(--c1);
      --bs-btn-hover-border-color: var(--c1);
      --bs-btn-focus-shadow-rgb: 125,63,255;
    }

    /* Hero */
    .hero{
      padding: 26px 0 56px;
      color:#fff;
    }
    .hero .card{
      background: rgba(255,255,255,.08);
      backdrop-filter: blur(8px);
      border:1px solid rgba(255,255,255,.18);
      box-shadow: 0 20px 60px rgba(0,0,0,.25);
      border-radius: 40px;
      height: 600px;
    }

    /* Secciones blancas con sombra */
    .section{
      padding: 72px 0;
    }
    .card-feature{
      border:0;
      border-radius:40px;
      box-shadow: var(--shadow);
    }
    .btn{
      border-radius: 30px;
      box-shadow: 7px 7px 15px rgba(0, 0, 0, 0.3);
    }
    .divider-dark{
      background: linear-gradient(180deg, rgba(10,10,10,1) 0%, rgba(124,36,125,1) 100%);
      color:#fff;
      padding: 48px 0;
    }

    /* Fade-in on scroll */
    .reveal{
      opacity:0;
      transform: translateY(18px);
      transition: opacity .7s ease, transform .7s ease;
    }
    .reveal.visible{
      opacity:1;
      transform: none;
    }

    /* Carousel imagenes hero */
    .hero .carousel-item{
      height: 560px;
      border-radius:26px;
      overflow:hidden;
    }
    .hero .carousel-item > div{
      height:100%;
      background-size: cover;
      background-position: center;
    }

    /* Listas bonitas */
    .list-check{
      list-style:none;
      padding-left:0;
      margin:0;
    }
    .list-check li{
      padding-left:34px;
      position:relative;
      margin: .4rem 0;
    }
    .list-check li:before{
      content:"✓";
      position:absolute;
      left:0; top:0;
      width:24px; height:24px;
      border-radius:50%;
      display:grid; place-items:center;
      background-color: #8dff92;
      color: #3d29ff;font-weight:700; font-size:.85rem;
    }

    footer{
      background:#0f0f14;
      color:#cfcfe4;
      padding: 48px 0;
    }
    .link-light-underline a{
      color:#fff; text-decoration: none;
      border-bottom:1px dashed rgba(255,255,255,.35);
    }
    .navbar-expand-lg .navbar-nav .nav-link {
    margin: 0px 10px;
    font-weight: 400;
    color: white;
    }
    .card img{
      margin-bottom: 10px;
      width: 100%;
    }
    .display-5 {
      font-size: calc(2.125rem + 2.1vw);
      font-weight: 300;
      line-height: 1;
      }
    h2 {
      font-size: calc(1.125rem + 2.1vw);
      font-weight: 300;
      line-height: 1;
      }

      /* --- Texto con degradado animado tipo "aurora" --- */
.text-aurora {
  /* mismo set de capas que tu fondo */
  background:
    radial-gradient(circle at 20% 30%, rgba(141,255,146,.65) 0%, rgba(141,255,146,0) 45%),
    radial-gradient(circle at 80% 70%, rgba(61,41,255,.65) 0%, rgba(61,41,255,0) 55%),
    radial-gradient(circle at 50% 50%, rgba(127,63,255,.55) 0%, rgba(127,63,255,0) 60%),
    linear-gradient(135deg, var(--c1), var(--c2), var(--c3));
  background-blend-mode: screen;

  /* importante para que el degradado "llene" las letras */
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent; /* Safari/Chrome */
  color: transparent;                   /* fallback */

  /* para que haya material suficiente que se mueva */
  background-size: 200% 200%, 200% 200%, 200% 200%, 300% 300%;
  animation: auroraShift 1s ease-in-out infinite;
  display: inline-block; /* por si el font rendering lo requiere */
  filter: saturate(1.1) contrast(1.05);
  padding-bottom: 10px;
  margin-top: 50px;
}

/* Animación: desplazamos posiciones de cada capa */
@keyframes auroraShift {
  0% {
    background-position:
      20% 30%,
      80% 70%,
      50% 50%,
      0% 0%;
  }
  50% {
    background-position:
      35% 25%,
      65% 75%,
      55% 45%,
      100% 100%;
  }
  100% {
    background-position:
      20% 30%,
      80% 70%,
      50% 50%,
      0% 0%;
  }
}

/* Respeto a usuarios que prefieren menos movimiento */
@media (prefers-reduced-motion: reduce) {
  .text-aurora { animation: none; }
}