/* ==================================================
CATEGORY - PERSONA [START]
================================================== -->
/* =====================================
PERSONA
===================================== */

.persona {

    margin-left:280px;

    width:calc(100% - 280px);

    min-height:100vh;

    display:flex;

    justify-content:center;

    align-items:center;

    padding:60px;

}



/* =====================================
PERSONA WRAPPER
===================================== */

.persona-wrapper {

    width:min(1200px,100%);

}

.persona-wrapper h2 {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
    text-align: center;
}

.persona-wrapper h2::before,
.persona-wrapper h2::after {
    content: "";

    flex: 1;

    height: 1px;

    background: #1c1c1c;
}
/* =====================================
PERSONA GRID
===================================== */

.persona-grid {

    display:grid;

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

    gap:20px;

}

/* =====================================
PERSONA SECTION
===================================== */

.persona-section {

    width: min(1100px, 90%);

    margin: 0 auto;

}


.persona-section h2 {

    margin-bottom: 30px;

}


/* =====================================
PERSONA GRID
===================================== */

.persona-grid {

    display: grid;

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

    gap: 20px;

}


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

.persona-card {

    overflow: hidden;

    background: #ffffff;

    border-radius: 16px;

    box-shadow:
        0 10px 30px rgba(0,0,0,0.08);

}


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

.persona-image {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    overflow: hidden;
    background: #1c1c1c;
}


.persona-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* =====================================
NAME BAR
===================================== */

.persona-name {

    padding: 15px 20px;

    background: #1c1c1c;

    color: #ffffff;

    font-family: "Poppins", sans-serif;

    font-size: 14px;

    font-weight: 600;

    letter-spacing: 0.08em;

}

/* ==================================================
CATEGORY - PERSONA [END]
================================================== */