:root{
    --bd-purple:#CDB4FF;
    --bd-purple-dark:#B89CFF;
  }
  
  .about-hero{
    text-align:center;
    padding:5rem 1rem 3rem;
  }
  .about-hero h1{
    color:#fff;
    font-weight:700;
    line-height:1.2;
  }
  .about-hero .sprinkle{
    color:var(--bd-purple);
    font-size:1.6rem;
    display:inline-block;
    transform:translateY(-6px);
    margin-right:.25rem;
  }
  .about-hero p{
    color:#ccc;
    max-width:760px;
    margin:1rem auto 0;
  }
  
  .about-grid .card{
    background:rgba(255,255,255,0.03);
    backdrop-filter:blur(8px);
    border-radius:16px;
    border:1px solid rgba(205,180,255,0.15);
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .about-grid .card:hover{
    transform:translateY(-3px);
    box-shadow:0 8px 24px rgba(0,0,0,.25);
  }