main 
{
    flex: 1;
}

a {
    text-decoration: none;
}

    /* --- Aesthetic background brushes (English comments) --- */
    .hero {
      background: radial-gradient(1200px 600px at 10% -10%, rgba(0, 128, 96, .14), transparent 60%),
                  radial-gradient(1000px 500px at 110% 10%, rgba(255, 140, 0, .10), transparent 60%);
    }
    .section-title span {
      display: inline-block;
      padding: .25rem .5rem;
      border-radius: .5rem;
      font-weight: 600;
    }
    /* --- Vertical timeline (DESC: latest first) --- */
    .timeline { position: relative; padding-left: 2rem; border-left: 3px solid var(--bs-border-color); }
    .timeline-item { position: relative; margin-bottom: 1.5rem; padding-left: .75rem; }
    .timeline-item::before {
      content: ""; position: absolute; left: -1.09rem; top: .35rem; width: .85rem; height: .85rem; border-radius: 50%;
      background: var(--bs-success); box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--bs-success), transparent 75%);
    }
    /* --- Cards hover polish --- */
     .card-hover:hover { transform: translateY(-2px); box-shadow: 0 0.5rem 1rem rgba(142, 67, 67, 0.1); 
      border: 2px solid #fff;   
      border-radius: 15px;     
      background-color: transparent; 
    } 
    .link-muted { color: #10CAF0; text-decoration: none;}
    .link-muted:hover { color: orange; }
    /* .badge-skill { background: color-mix(in srgb, var(--bs-primary), transparent 80%); } */
    /* --- Utility for tiny labels --- */
    .mini-label { font-size: .825rem; letter-spacing: .2px; }

    .card-hover-custom {
      border: 2px solid transparent;
      border-radius: 12px;
      transition: all 0.3s ease-in-out;
    }

    /* Light mode hover (resalta en blanco) */
    [data-bs-theme="light"] .card-hover-custom:hover {
      border-color: #000000;
      box-shadow: 0 0 12px rgba(255, 255, 255, 0.6);
    }

    /* Dark mode hover (resalta en gris claro) */
    [data-bs-theme="dark"] .card-hover-custom:hover {
      border-color: #444;
      box-shadow: 0 0 12px rgba(255, 255, 255, 0.15);
    }

    .bi-cpu
    {
      color: orange;
      font-weight: bolder;
    }
    .name
    {
      font-size: 54;
      font-weight: bolder;
      color: orange;
    }