/* ================= RESUME PAGE ================= */

.resume-page{

    padding:5rem 0;

}

/* ================= IMAGE ================= */

.resume-image-column{

    position:sticky;

    top:120px;

}

.resume-image-wrapper{

    position:relative;

    border-radius:35px;

    overflow:hidden;

}

.resume-image-wrapper::before{

    content:"";

    position:absolute;

    inset:-20px;

    background:
    radial-gradient(circle,
    rgba(212,175,55,.22),
    transparent 70%);

    filter:blur(40px);

    z-index:-1;

}

.resume-image{

    width:100%;

    border-radius:35px;

    object-fit:cover;

    animation:
    floatingImage 6s ease-in-out infinite;

    box-shadow:
    0 20px 60px rgba(0,0,0,.45),
    0 0 60px rgba(212,175,55,.12);

}

/* ================= CARD ================= */

.resume-card{

    position:relative;

    padding:3rem;

    border-radius:35px;

    background:
    linear-gradient(
    145deg,
    rgba(255,255,255,.05),
    rgba(255,255,255,.02));

    backdrop-filter:blur(18px);

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

    overflow:hidden;

}

/* ================= TITLE ================= */

.resume-title{

    font-size:
    clamp(2rem,5vw,4rem);

    line-height:1.5;

    margin-bottom:1rem;

}

/* ================= DESCRIPTION ================= */

.resume-description{

    display:flex;

    flex-direction:column;

    gap:22px;

}

/* ================= ITEM ================= */

.resume-item{

    position:relative;

    padding:1.5rem 1.5rem 1.5rem 1.8rem;

    border-radius:24px;

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

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

    line-height:2.2;

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

    transition:.4s;

    overflow:hidden;

}

/* golden glow */

.resume-item::before{

    content:"";

    position:absolute;

    top:0;
    right:0;

    width:5px;
    height:100%;

    background:
    linear-gradient(
    to bottom,
    #D4AF37,
    transparent);

}

/* hover */

.resume-item:hover{

    transform:
    translateY(-6px);

    background:
    rgba(212,175,55,.08);

    border-color:
    rgba(212,175,55,.18);

    box-shadow:
    0 10px 35px rgba(212,175,55,.08);

}

/* bold title */

.resume-item strong{

    color:#D4AF37;

}

/* ================= MOBILE ================= */

@media(max-width:991px){

    .resume-page{

        padding:3rem 1rem;

    }

    .resume-image-column{

        position:relative;

        top:auto;

    }

    .resume-card{

        padding:2rem;

    }

    .resume-title{

        text-align:center;

    }

}