/* ==========================================================================
    LABORATORY INSTRUMENTS
========================================================================== */

.knowledge-domain{
    background:#fff;
    /* Optimasi rendering font agar super halus di layar Retina Mac & Windows */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.knowledge-container{
    max-width:1180px;
    margin:auto;
    padding:140px 5%;
}



/* ==========================================================================
    HERO
========================================================================== */

.knowledge-hero{
    max-width:900px;
    margin-bottom:120px;
}

.knowledge-eyebrow{
    display:inline-block;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.18em;
    color:#888;
    margin-bottom:18px;
}

.knowledge-title{
    font-size:72px;
    line-height:1;
    letter-spacing:-.05em;
    font-weight:600;
    margin-bottom:28px;
    color:#111;
}

.knowledge-description{
    max-width:760px;
    font-size:20px;
    line-height:1.9;
    color:#666;
    margin-bottom:50px;
}

.knowledge-meta{
    display:flex;
    flex-wrap:wrap;
    gap:50px;
}

.knowledge-meta-item strong{
    display:block;
    font-size:18px;
    margin-bottom:6px;
    font-weight:500; /* Menurunkan font-weight tebal kasar bawaan browser */
}

.knowledge-meta-item span{
    font-size:14px;
    color:#888;
}



/* ==========================================================================
    INTRODUCTION
========================================================================== */

.knowledge-intro{
    padding:100px 0;
    border-top:1px solid #ececec;
}

.knowledge-label{
    display:block;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.16em;
    color:#888;
    margin-bottom:18px;
}

.knowledge-intro h2,
.knowledge-preview h2{
    font-size:48px;
    line-height:1.2;
    letter-spacing:-.03em;
    max-width:760px;
    margin-bottom:30px;
    font-weight:500; /* Tipografi Sleek */
    color:#111;
}

.knowledge-intro p{
    max-width:820px;
    font-size:18px;
    line-height:2;
    color:#666;
}



/* ==========================================================================
    CATEGORIES
========================================================================== */

.knowledge-preview{
    padding:120px 0;
}

.knowledge-preview-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
    margin-top:60px;
}

.knowledge-preview-item{
    padding:34px;
    border:1px solid #ececec;
    transition: border-color .2s ease, transform .2s ease;
}

.knowledge-preview-item:hover{
    transform:translateY(-2px); /* Penyesuaian hover tipis kelas atas */
    border-color:#111;
}

.knowledge-preview-item h3{
    font-size:24px;
    font-weight:500;
    margin-bottom:14px;
    letter-spacing:-.02em;
    color:#111;
}

.knowledge-preview-item p{
    font-size:16px;
    line-height:1.8;
    color:#666;
}



/* ==========================================================================
    INSTRUMENT FAMILY
========================================================================== */

.knowledge-topics{
    padding:120px 0;
}

.knowledge-topic{
    display:grid;
    grid-template-columns:120px 1fr;
    gap:60px;
    padding:80px 0;
    border-top:1px solid #ececec;
}

.knowledge-number{
    font-size:58px;
    font-weight:300;
    line-height:1;
    color:#d6d6d6;
}

.knowledge-content h2{
    font-size:40px;
    line-height:1.15;
    letter-spacing:-.03em;
    margin:16px 0 24px;
    font-weight:500;
    color:#111;
}

.knowledge-content>p{
    max-width:820px;
    font-size:18px;
    line-height:2;
    color:#666;
    margin-bottom:50px;
}



/* ==========================================================================
    INSTRUMENT CARDS (Refined Premium Interactivity)
========================================================================== */

.instrument-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:28px;
    margin-top:10px;
}

.instrument-card{
    position: relative; /* WAJIB: Kunci perimeter agar link melapis sempurna */
    padding:32px;
    border:1px solid #ececec;
    background:#fff;
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.instrument-card:hover{
    transform:translateY(-2px); /* DIUBAH: Reduksi lompatan dari -5px ke -2px agar tenang */
    border-color:#111;
    box-shadow:0 10px 25px rgba(0,0,0,.015); /* DIUBAH: Bayangan ultra-soft, mewah & bersih */
}

.instrument-card h3{
    font-size:24px;
    font-weight:500;
    letter-spacing:-.02em;
    margin-bottom:16px;
    color:#111;
}

.instrument-card p{
    font-size:16px;
    line-height:1.9;
    color:#666;
    margin-bottom:26px;
}

.instrument-card a{
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-size:13px;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:.12em;
    text-decoration:none;
    color:#111;
}

/* KUNCI PREMIUM NAVIGASI: Seluruh area permukaan box card otomatis menjadi link aktif */
.instrument-card a::after{
    content:"";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
}

/* Modifikasi panah CSS agar transisi micro-interaction berjalan rapi */
.instrument-card a::before{
    content:"→";
    order: 2;
    transition: transform .2s ease;
}

/* Animasi dorong panah saat keseluruhan komponen card disentuh kursor */
.instrument-card:hover a::before{
    transform:translateX(4px);
}



/* ==========================================================================
    NEXT SECTION PLACEHOLDER
========================================================================== */

.knowledge-learn-before,
.knowledge-related,
.knowledge-cta{
    padding:120px 0;
    border-top:1px solid #ececec;
}



/* ==========================================================================
    RESPONSIVE
========================================================================== */

@media(max-width:992px){

    .knowledge-preview-grid,
    .instrument-grid{
        grid-template-columns:1fr;
    }

    .knowledge-topic{
        grid-template-columns:1fr;
        gap:30px;
    }

    .knowledge-number{
        font-size:44px;
    }

    .knowledge-title{
        font-size:56px;
    }

    .knowledge-intro h2,
    .knowledge-preview h2{
        font-size:40px;
    }

    .knowledge-content h2{
        font-size:34px;
    }

}

@media(max-width:768px){

    .knowledge-container{
        padding:100px 24px;
    }

    .knowledge-hero{
        margin-bottom:80px;
    }

    .knowledge-title{
        font-size:44px;
    }

    .knowledge-description{
        font-size:17px;
        line-height:1.8;
    }

    .knowledge-intro,
    .knowledge-preview,
    .knowledge-topics,
    .knowledge-learn-before,
    .knowledge-related,
    .knowledge-cta{
        padding:80px 0;
    }

    .knowledge-intro h2,
    .knowledge-preview h2{
        font-size:32px;
    }

    .knowledge-content h2{
        font-size:28px;
    }

    .knowledge-content>p{
        font-size:16px;
        line-height:1.9;
    }

    .instrument-card{
        padding:28px;
    }

    .instrument-card h3{
        font-size:21px;
    }

}