/* =====================================
   Research Timeline

   یکپارچه‌سازی:
   - .section-header/.section-label/.section-header h2/.section-header p
     بدون scope بازتعریف شده بودن و می‌تونستن هدر بقیه‌ی بخش‌های
     سایت رو هم تغییر بدن → کاملاً حذف شدن، از تعریف سراسری
     مشترک (در page-sections.integrated.css) استفاده می‌شه
   - white → var(--background)، rgba هاردکد → primary-rgb/secondary-rgb
   - رنگ heading کارت‌ها از primary-dark → var(--text)
   - .timeline-card p از var(--text-muted) به var(--text-light)
     تغییر کرد (متن اصلی بدنه‌ی کارت، نه متن فرعی/کوچیک)
   - پدینگ/px→rem → همون الگوی همیشگی
===================================== */


.research-timeline{

    padding:var(--section-space) 0;

    background:
    linear-gradient(
        180deg,
        var(--background),
        var(--surface)
    );

}



/* Timeline */


.timeline{

    position:relative;

    max-width:992px;

    margin:auto;

}



.timeline::before{


    content:"";

    position:absolute;

    top:0;

    bottom:0;

    left:50%;


    width:2px;


    background:

    linear-gradient(

        to bottom,

        var(--accent),

        var(--secondary)

    );


    transform:translateX(-50%);


}





.timeline-item{


    position:relative;

    display:flex;

    justify-content:center;

    margin-bottom:70px;


}




.timeline-dot{


    position:absolute;


    left:50%;

    transform:translateX(-50%);


    width:22px;

    height:22px;


    background:var(--background);


    border-radius:50%;


    border:5px solid var(--secondary);


    z-index:2;


    box-shadow:

    0 0 20px rgba(var(--secondary-rgb),.35);


}




.timeline-dot span{


    display:block;

    width:100%;

    height:100%;

}




.timeline-card{


    width:42%;


    background:var(--background);


    padding:30px;


    border-radius:18px;


    box-shadow:

    0 15px 40px rgba(var(--primary-rgb),.08);


    border:

    1px solid rgba(var(--primary-rgb),.08);


}



.timeline-item:nth-child(odd)
.timeline-card{


    margin-right:50%;


}



.timeline-item:nth-child(even)
.timeline-card{


    margin-left:50%;


}



.timeline-year{

    font-family:var(--font-heading);
    font-weight:var(--heading-weight);

    font-size:2rem;

    color:var(--secondary);

    margin-bottom:10px;


}



.timeline-card h3{

    font-family:var(--font-heading);
    font-weight:var(--heading-weight);

    color:var(--text);

    font-size:1.375rem;

    margin-bottom:15px;


}



.timeline-card p{

    font-family:var(--font-body);
    font-weight:var(--body-weight);

    color:var(--text-light);

    line-height:1.8;

}



.timeline-card.featured{


    border:

    2px solid var(--accent);


    background:

    linear-gradient(

        145deg,

        var(--background),

        var(--surface)

    );


}





@media(max-width:768px){


.timeline::before{


    left:20px;

}



.timeline-item{


    justify-content:flex-start;

}



.timeline-dot{


    left:20px;

}



.timeline-card,
.timeline-item:nth-child(odd) .timeline-card,
.timeline-item:nth-child(even) .timeline-card{


    width:calc(100% - 60px);

    margin-left:60px;

    margin-right:0;


}


}