/*==========================================================
                    PROJECTS
==========================================================*/

.projects{

padding:50px 8%;

background:#fff;

}

.featured-project{

padding:50px;

border-radius:32px;

margin:60px auto;

max-width:1100px;

transition:.35s;

}

.featured-project:hover{

transform:translateY(-8px);

box-shadow:0 28px 60px rgba(151,161,59,.15);

}

.project-label{

display:inline-block;

padding:8px 18px;

background:var(--hover);

color:var(--sage);

border-radius:999px;

font-size:14px;

font-weight:600;

margin-bottom:22px;

}

.featured-project h3{

font-size:38px;

color:var(--text);

margin-bottom:25px;

}

.featured-project p{

font-size:17px;

line-height:1.9;

margin-top:25px;

}

.tech-stack{

display:flex;

flex-wrap:wrap;

gap:12px;

margin-top:15px;

}

.tech-stack span{

padding:9px 18px;

background:var(--blush);

border-radius:999px;

font-size:14px;

font-weight:500;

color:var(--rose);

transition:.3s;

}

.tech-stack span:hover{

background:var(--hover);

color:var(--sage);

}

.project-category{

margin:90px 0 40px;

text-align:center;

}

.project-category h3{
    font-family:'Cormorant Garamond', serif !important;
    font-size:2rem !important;
    color:var(--sage) !important;
    text-align:center !important;
    position:relative !important;
}


.project-grid{

display:grid;

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

gap:30px;

}

.project-card{

    padding:35px;

    border-radius:28px;

    position:relative;

    overflow:hidden;

    transition:.35s;

}

.project-card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:5px;

    background:linear-gradient(
        90deg,
        var(--rose),
        var(--sage)
    );

}

.project-card:hover{
    transform: translateY(-8px);
    box-shadow: 0 25px 55px rgba(151,161,59,.12);
}

.project-card h4{

font-size:26px;

color:var(--text);

margin-bottom:20px;

}

.project-card p{

margin-top:20px;

line-height:1.8;

}

.small span{

font-size:13px;

padding:8px 15px;

}

@media(max-width:900px){

.project-grid{

grid-template-columns:1fr;

}

.featured-project{

padding:35px;

}

}

/*==================================================
        RESEARCH PROJECTS
==================================================*/

.research-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(320px,1fr));

gap:28px;

margin-top:50px;

}

.research-card{

padding:32px;

border-radius:28px;

position:relative;

overflow:hidden;

transition:.35s;

}

.research-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 55px rgba(151,161,59,.12);

}

.research-card::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:5px;

background:linear-gradient(
90deg,
var(--rose),
var(--sage)
);

}

.research-icon{

width:58px;

height:58px;

border-radius:18px;

background:var(--hover);

display:flex;

align-items:center;

justify-content:center;

margin-bottom:22px;

transition:.35s;

}

.research-icon svg{

width:26px;

height:26px;

color:var(--sage);

transition:.35s;

}

.research-card:hover .research-icon{

background:var(--blush);

transform:rotate(-10deg);

}

.research-card:hover .research-icon svg{

color:var(--rose);

transform:scale(1.12);

}

.research-card h4{

font-size:24px;

color:var(--text);

margin-bottom:15px;

line-height:1.35;

}

.research-card p{

line-height:1.8;

margin-bottom:25px;

}

.research-tags{

display:flex;

flex-wrap:wrap;

gap:10px;

}

.research-tags span{

padding:8px 16px;

background:var(--hover);

border-radius:999px;

font-size:13px;

font-weight:500;

color:var(--sage);

transition:.3s;

}

.research-tags span:hover{

background:var(--blush);

color:var(--rose);

}

/*==================================================
            RESEARCH INTERESTS
==================================================*/

.research-banner{
    padding:30px !important;
    margin:0 !important;
    height:auto !important;
    min-height:0 !important;
}

.research-banner h3{

    font-size:20px;

    color:var(--sage);

    margin-bottom:35px;

}

.interest-pills{

    display:flex;

    flex-wrap:wrap;

    justify-content:center;

    gap:18px;

}

.interest-pill{

    display:flex;

    align-items:center;

    gap:12px;

    padding:14px 24px;

    border-radius:999px;

    background:var(--hover);

    transition:.35s ease;

    cursor:default;

}

.interest-pill svg{

    width:20px;

    height:20px;

    color:var(--sage);

    transition:.35s ease;

}

.interest-pill span{

    font-size:15px;

    font-weight:500;

    color:var(--text);

}

.interest-pill:hover{

    background:var(--blush);

    transform:translateY(-6px);

}

.interest-pill:hover svg{

    color:var(--rose);

    transform:rotate(-10deg) scale(1.15);

}

.interest-pill:hover span{

    color:var(--rose);

}