:root{
    --blue:#0935ff;
    --cyan:#00e1ff;
    --white:#fff;
    --bg:#070a1a;
    --muted:rgba(255,255,255,.72);
    --muted2:rgba(255,255,255,.55);
    --card:rgba(255,255,255,.06);
    --border:rgba(0,225,255,.35);
}

body{
    background:
        radial-gradient(1200px 500px at 50% -150px, rgba(0,225,255,.22), transparent 60%),
        linear-gradient(180deg, #050717 0%, #070a1a 100%);
    color:var(--white);
}

.page{
    width:min(1000px, 92vw);
    margin:0 auto;
    padding:1.5rem 0 4rem;
}

.about{ padding:1.5rem 0 0; }

.section-title{
    font-size:clamp(1.7rem, 3.6vw, 2.3rem);
    margin:0 0 .6rem;
}

.lead{
    color:var(--muted);
    line-height:1.7;
    margin:0 auto 1.8rem;
    max-width:68ch;
    text-align:center;
}

.about-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:1rem;
}

.card{
    background:var(--card);
    border:1px solid var(--border);
    border-radius:1.1rem;
    padding:1.2rem 1.1rem;
    box-shadow:0 18px 55px rgba(0,0,0,.25);
}

.card-title{ margin-bottom:.85rem; font-size:1.05rem; }

.list{ padding-left:1.1rem; margin:0; }
.list li{
    color:var(--muted2);
    line-height:1.7;
    margin:.35rem 0;
}

.links{ list-style:none; padding:0; margin:0; }
.links li{ margin:.55rem 0; }

.link{
    color:rgba(255,255,255,.9);
    text-decoration:none;
    border:1px solid rgba(0,225,255,.35);
    background:rgba(0,225,255,.08);
    padding:.55rem .8rem;
    border-radius:.85rem;
    display:inline-block;
    transition:transform .18s ease, background .18s ease;
}
.link:hover{
    transform:translateY(-1px);
    background:rgba(0,225,255,.14);
}

@media (max-width: 720px){
    .about-grid{ grid-template-columns:1fr; }
}