.experience-layout{
    display:grid;
    grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);
    gap:48px;
    align-items:start
}

.experience-intro{
    position:sticky;
    top:calc(var(--header-h) + 28px)
}

.experience-head{
    display:block;
    margin-bottom:0
}

.experience-head h2{
    margin:10px 0 14px
}

.experience-head p{
    margin:0;
    color:var(--muted);
    line-height:1.9;
    max-width:430px
}

.experience-timeline{
    position:relative;
    padding-left:28px
}

.experience-timeline:before{
    content:"";
    position:absolute;
    top:12px;
    bottom:12px;
    left:6px;
    width:1px;
    background:linear-gradient(180deg,rgba(var(--accent-rgb),.9),rgba(var(--accent-rgb),.18))
}

.experience-item{
    position:relative;
    padding:8px 0 28px 34px;
    border-bottom:1px solid var(--line);
    min-height:0
}

.experience-item:last-child{
    padding-bottom:0;
    border-bottom:0
}

.experience-dot{
    position:absolute;
    left:0;
    top:16px;
    width:12px;
    height:12px;
    border-radius:50%;
    background:var(--accent);
    box-shadow:0 0 0 4px rgba(11,19,35,.9),0 0 18px rgba(var(--accent-rgb),.65);
    transform:translateX(-50%)
}

.experience-date{
    font-size:12px;
    color:var(--accent);
    letter-spacing:.04em;
    font-weight:700;
    margin-bottom:8px
}

.experience-item h3{
    font-size:20px;
    margin:0 0 6px
}

.experience-org{
    font-size:13px;
    color:#b8c6d9;
    margin-bottom:14px
}

.experience-points{
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    gap:10px
}

.experience-points li{
    position:relative;
    padding-left:18px;
    color:var(--muted);
    line-height:1.8;
    font-size:14px
}

.experience-points li:before{
    content:"";
    position:absolute;
    left:0;
    top:.72em;
    width:7px;
    height:7px;
    border-radius:50%;
    background:rgba(var(--accent-rgb),.95);
    box-shadow:0 0 10px rgba(var(--accent-rgb),.45)
}