/* =====================================
   PKBM AL-AMANAH ABOUT PAGE
   BLUE SCHOOL THEME
===================================== */


.pkbm-about-section{

    padding:70px 0;
    background:#f4f9ff;

}



/* CARD */

.pkbm-card,
.pkbm-info-card{

    background:#ffffff;
    padding:35px;
    border-radius:20px;

    box-shadow:
    0 10px 35px rgba(0, 80, 160, 0.10);

    border-top:4px solid #0d6efd;

    transition:.3s;

}



.pkbm-card:hover,
.pkbm-info-card:hover{

    transform:translateY(-6px);

    box-shadow:
    0 15px 40px rgba(0,80,160,.18);

}




/* TITLE */


.pkbm-title{

    text-align:center;
    margin-bottom:30px;

}



.pkbm-title span{

    color:#0d6efd;
    font-size:18px;
    font-weight:600;

}



.pkbm-title h2{

    color:#073b7a;
    font-weight:700;
    font-size:32px;

}




/* ICON */


.pkbm-icon{

    width:65px;
    height:65px;

    background:#0d6efd;

    color:white;

    border-radius:50%;

    display:flex;
    justify-content:center;
    align-items:center;

    font-size:30px;

    margin-bottom:20px;

    box-shadow:
    0 8px 20px rgba(13,110,253,.35);

}



.pkbm-info-card h3{

    color:#073b7a;

    font-weight:700;

    margin-bottom:20px;

}




/* TEXT */

.pkbm-card p,
.pkbm-info-card p,
.pkbm-info-card li{

    color:#555;

    line-height:1.8;

}



.pkbm-info-card ol{

    padding-left:20px;

}



.pkbm-info-card li{

    margin-bottom:12px;

}




/* TUJUAN */

.pkbm-card h2{

    color:#073b7a;

}


/* ===============================
   TARGET LULUSAN PKBM
================================ */

.pkbm-graduate {

    background: linear-gradient(
        135deg,
        #063b91,
        #0056c9
    );

    padding: 45px 50px;

    border-radius: 35px;

    color: white;

    box-shadow: 0 15px 35px rgba(0,0,0,0.15);

}



/* Judul */

.pkbm-graduate h2 {

    text-align: center;

    color: white;

    font-size: 36px;

    font-weight: 700;

    margin-bottom: 45px;

}



/* List */

.pkbm-graduate ul {

    list-style: none;

    padding-left: 0;

}



.pkbm-graduate li {

    color: white;

    font-size: 18px;

    line-height: 1.8;

    margin-bottom: 25px;

    position: relative;

    padding-left: 45px;

}



/* Icon checklist */

.pkbm-graduate li::before {

    content: "✓";

    position: absolute;

    left: 0;

    top: 0;

    font-size: 35px;

    font-weight: bold;

    color: white;

}



/* Responsive */

@media(max-width:768px){

    .pkbm-graduate{

        padding:35px 20px;

        border-radius:25px;

    }


    .pkbm-graduate h2{

        font-size:28px;

    }


    .pkbm-graduate li{

        font-size:16px;

        padding-left:35px;

    }


}


/* PENUTUP */


.pkbm-closing{


    background:#ffffff;

    padding:35px;

    border-radius:20px;


    text-align:center;


    border-left:

    6px solid #0d6efd;


    box-shadow:

    0 10px 30px rgba(0,0,0,.08);


}



.pkbm-closing h4{


    color:#073b7a;

    font-weight:700;


}



/* RESPONSIVE */


@media(max-width:768px){


    .pkbm-title h2{

        font-size:26px;

    }



    .pkbm-card,
    .pkbm-info-card,
    .pkbm-graduate{

        padding:25px;

    }


}

/* ===================================
   PROFIL PKBM
=================================== */


.pkbm-profile-section{

    padding:70px 0;

    background:#ffffff;

}



.pkbm-profile-image img{

    width:100%;

    height:450px;

    object-fit:cover;

    border-radius:20px;


    box-shadow:
    0 15px 35px rgba(0,0,0,.12);

}



.pkbm-profile-content{

    padding-left:30px;

}



.pkbm-profile-content h2{

    font-size:38px;

    font-weight:700;

    color:#073b7a;

    margin-bottom:35px;

}



.profile-list{

    list-style:none;

    padding:0;

}



.profile-list li{

    font-size:18px;

    color:#333;

    margin-bottom:22px;

    line-height:1.6;

}



.profile-list strong{

    color:#073b7a;

    font-weight:700;

}



@media(max-width:768px){


    .pkbm-profile-content{

        padding-left:0;

        margin-top:30px;

    }



    .pkbm-profile-content h2{

        font-size:30px;

    }



    .pkbm-profile-image img{

        height:300px;

    }


}

/* =========================
   STRUKTUR ORGANISASI
========================= */

.struktur-section {
    padding: 70px 0;
    background: #f8f9fa;
}


.struktur-title h2 {
    font-size: 35px;
    font-weight: 700;
    color: #053c76;
    margin-bottom: 10px;
}


.struktur-title p {
    color: #777;
    margin-bottom: 40px;
}


.struktur-wrapper {
    text-align: center;
}


.struktur-card {
    background: white;
    padding: 25px 20px;
    border-radius: 15px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    transition: 0.3s;
}


.struktur-card:hover {
    transform: translateY(-8px);
}


.struktur-card img {
    width: 130px;
    height: 130px;
    object-fit: cover;
    border-radius: 50%;
    margin-bottom: 20px;
    border: 5px solid #f1c40f;
}


.struktur-card h3 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 8px;
}


.struktur-card span {
    color: #777;
    font-size: 15px;
}



.struktur-grid {

    margin-top: 40px;

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 30px;

}



/* Responsive Tablet */

@media(max-width: 992px){

    .struktur-grid{
        grid-template-columns: repeat(2,1fr);
    }

}



/* Responsive HP */

@media(max-width:768px){

    .struktur-section{
        padding:50px 15px;
    }


    .struktur-title h2{
        font-size:28px;
    }


    .struktur-grid{
        grid-template-columns:1fr;
        gap:20px;
    }


    .struktur-card img{
        width:110px;
        height:110px;
    }

}