/* ====================
TIMELINE
==================== */

.resume-section{

margin-top:40px;

}

.timeline{

position:relative;

padding-right:40px;

}

.timeline::before{

content:"";

position:absolute;

top:0;
right:12px;

width:2px;

height:100%;

background:
linear-gradient(
180deg,
#4f7cff,
rgba(79,124,255,.15)
);

}

.timeline-item{

position:relative;

margin-bottom:32px;

}

.timeline-dot{

position:absolute;

right:-38px;

top:28px;

width:22px;
height:22px;

border-radius:50%;

background:#4f7cff;

box-shadow:
0 0 25px rgba(79,124,255,.6);

z-index:2;

}

.timeline-card{

padding:30px;

border-radius:24px;

transition:.4s;

}

.timeline-card:hover{

transform:
translateY(-6px);

border-color:
rgba(79,124,255,.35);

}

.timeline-date{

display:inline-flex;

padding:8px 16px;

border-radius:999px;

background:
rgba(79,124,255,.12);

color:#7ea1ff;

font-size:14px;

margin-bottom:16px;

}

.timeline-card h4{

font-size:24px;

margin-bottom:12px;

}

.timeline-card p{

color:var(--text-light);

}

.timeline-card:hover{

box-shadow:
0 0 0 1px rgba(79,124,255,.15),
0 20px 50px rgba(79,124,255,.12);

}

.radial-grid{

display:grid;

grid-template-columns:
repeat(4,1fr);

gap:24px;

}

.radial-card{

padding:30px;

text-align:center;

border-radius:28px;

}

.circle{

width:140px;
height:140px;

margin:auto auto 20px;

border-radius:50%;

display:flex;

align-items:center;
justify-content:center;

background:
conic-gradient(
#4f7cff calc(var(--percent)*1%),
#1c2740 0
);

}

.circle span{

width:110px;
height:110px;

border-radius:50%;

background:#0f172a;

display:flex;

align-items:center;
justify-content:center;

font-weight:700;

}


/* awards */
.awards{

display:grid;

gap:24px;

}
.award-card{

padding:28px;

border-radius:24px;

background:
rgba(255,255,255,.03);

border:
1px solid rgba(255,255,255,.08);

backdrop-filter:
blur(20px);

transition:.3s ease;

}
.award-card:hover{

transform:
translateY(-6px);

border-color:
rgba(79,124,255,.3);

box-shadow:
0 20px 40px rgba(0,0,0,.25);

}
.award-header{

display:flex;

justify-content:space-between;

align-items:center;

gap:16px;

margin-bottom:12px;

}
.award-card h4{

font-size:18px;

font-weight:700;

margin:0;

}
.award-year{

padding:6px 12px;

border-radius:999px;

background:
rgba(79,124,255,.12);

color:#4f7cff;

font-size:13px;

font-weight:600;

}
.award-card p{

margin-top:12px;

line-height:1.9;

color:
rgba(255,255,255,.7);

}
.cert-grid{

display:grid;

grid-template-columns:
repeat(3,1fr);

gap:24px;

}

.cert-card{

padding:28px;

border-radius:24px;

background:
rgba(255,255,255,.03);

border:
1px solid rgba(255,255,255,.08);

transition:.3s;

position:relative;

overflow:hidden;

}
.cert-card::before{

content:"";

position:absolute;

inset:0;

background:
linear-gradient(
135deg,
rgba(79,124,255,.15),
transparent
);

opacity:0;

transition:.3s;

}
.cert-card:hover::before{

opacity:1;

}
.cert-card:hover{

transform:
translateY(-6px);

border-color:
rgba(79,124,255,.3);

}
.cert-icon{

width:60px;

height:60px;

display:flex;

align-items:center;

justify-content:center;

border-radius:18px;

background:
rgba(79,124,255,.12);

font-size:24px;

margin-bottom:20px;

}
.cert-card h4{

font-size:18px;

margin-bottom:10px;

}
.cert-org{

display:block;

font-size:14px;

color:
rgba(255,255,255,.55);

margin-bottom:16px;

}
.cert-badge{

display:inline-flex;

padding:6px 12px;

border-radius:999px;

background:
rgba(16,185,129,.12);

color:#10b981;

font-size:12px;

font-weight:600;

}