
/* =========================================================
   ARTIKEL & KAJIAN — PUBLIC EDITORIAL PREMIUM
   Frontend only. Does not change admin or standard Berita.
========================================================= */

:root{
    --ak-emerald-950:#032c23;
    --ak-emerald-900:#064c3b;
    --ak-emerald-800:#07654d;
    --ak-emerald-700:#087e60;
    --ak-emerald-500:#10b981;
    --ak-emerald-soft:#edf9f4;
    --ak-gold-700:#8c6524;
    --ak-gold-500:#b98a38;
    --ak-gold-soft:#fbf4e5;
    --ak-ink:#183a33;
    --ak-paper:#fbfdfc;
    --ak-serif:"Literata","Playfair Display",Georgia,serif;
}

/* -----------------------------
   LISTING CARDS
----------------------------- */

.publication-card.artikel,
.publication-card.kajian{
    position:relative;
}

.publication-card.artikel .news-image,
.publication-card.kajian .news-image{
    height:270px;
}

.publication-card.artikel .news-card-body,
.publication-card.kajian .news-card-body{
    padding:26px 25px 24px;
}

.publication-card.artikel h3,
.publication-card.kajian h3{
    font-family:"Playfair Display",Georgia,serif;
    font-size:25px;
    line-height:1.2;
    letter-spacing:-.25px;
}

.publication-card.artikel .news-card-body>p,
.publication-card.kajian .news-card-body>p{
    font-family:var(--ak-serif);
    font-size:14px;
    line-height:1.85;
    color:#62766f;
}

.publication-card.artikel{
    border-color:rgba(8,126,96,.12);
}

.publication-card.kajian{
    border-color:rgba(185,138,56,.18);
}

.publication-kind{
    display:inline-flex!important;
    align-items:center;
    gap:7px;
    width:max-content;
    margin:0 0 11px;
    padding:6px 10px!important;
    border-radius:999px!important;
    font-size:9px!important;
    line-height:1!important;
    letter-spacing:1.7px;
    font-weight:900!important;
    text-transform:uppercase;
}

.publication-kind.artikel{
    color:var(--ak-emerald-700)!important;
    background:#e8f7f1!important;
    border:1px solid rgba(8,126,96,.13)!important;
}

.publication-kind.kajian{
    color:var(--ak-gold-700)!important;
    background:var(--ak-gold-soft)!important;
    border:1px solid rgba(185,138,56,.18)!important;
}

/* -----------------------------
   DETAIL PAGE BASE
----------------------------- */

.detail-page.publication-artikel,
.detail-page.publication-kajian{
    background:var(--ak-paper);
}

/*
   IMPORTANT:
   detail.css defines a dark hero.
   The previous editorial CSS changed only the background
   to light but left the inherited white text, causing the
   screenshot's invisible title. We deliberately keep a
   dark editorial hero here.
*/

.publication-artikel .detail-header,
.publication-kajian .detail-header{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    color:#fff!important;
    background:
        radial-gradient(circle at 88% 8%,rgba(116,255,205,.20),transparent 28%),
        radial-gradient(circle at 8% 105%,rgba(16,185,129,.14),transparent 30%),
        linear-gradient(135deg,#032c23 0%,#075440 54%,#0a8a67 100%)!important;
    padding:74px 0 76px;
}

.publication-kajian .detail-header{
    background:
        radial-gradient(circle at 88% 8%,rgba(255,221,142,.16),transparent 28%),
        radial-gradient(circle at 8% 105%,rgba(185,138,56,.12),transparent 30%),
        linear-gradient(135deg,#172c26 0%,#234b3f 52%,#5b4a2c 100%)!important;
}

.publication-artikel .detail-header::before,
.publication-kajian .detail-header::before{
    content:"";
    position:absolute;
    width:520px;
    height:520px;
    right:-230px;
    top:-300px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:50%;
    box-shadow:
        0 0 0 70px rgba(255,255,255,.025),
        0 0 0 140px rgba(255,255,255,.018);
    pointer-events:none;
    z-index:-1;
}

.publication-artikel .detail-header::after,
.publication-kajian .detail-header::after{
    height:2px;
    background:linear-gradient(90deg,transparent,#71efc2,rgba(255,255,255,.75),#71efc2,transparent)!important;
}

.publication-kajian .detail-header::after{
    background:linear-gradient(90deg,transparent,#d6ae63,rgba(255,255,255,.75),#d6ae63,transparent)!important;
}

.publication-artikel .detail-container,
.publication-kajian .detail-container{
    position:relative;
    z-index:2;
}

.publication-artikel .back-news,
.publication-kajian .back-news{
    color:rgba(255,255,255,.76)!important;
}

.publication-artikel .back-news:hover,
.publication-kajian .back-news:hover{
    color:#fff!important;
}

.publication-artikel .detail-category,
.publication-kajian .detail-category{
    margin-bottom:20px;
}

.publication-artikel .detail-category span,
.publication-kajian .detail-category span{
    color:#dffdf1!important;
    background:rgba(255,255,255,.075)!important;
    border-color:rgba(255,255,255,.18)!important;
}

.publication-kajian .detail-category span{
    color:#fff3d4!important;
}

.publication-artikel .detail-category span i{
    color:#78efc5!important;
}

.publication-kajian .detail-category span i{
    color:#e2bd6f!important;
}

.publication-artikel .detail-category .publication-kind,
.publication-kajian .detail-category .publication-kind{
    width:auto;
    padding:7px 12px!important;
    border:1px solid rgba(255,255,255,.20)!important;
    background:rgba(255,255,255,.08)!important;
}

.publication-artikel .detail-category .publication-kind.artikel{
    color:#b8f9df!important;
}

.publication-kajian .detail-category .publication-kind.kajian{
    color:#f1d28d!important;
}

.publication-artikel .detail-header h1,
.publication-kajian .detail-header h1{
    max-width:980px;
    margin:0;
    color:#fff!important;
    font-family:"Playfair Display",Georgia,serif!important;
    font-size:clamp(42px,6.2vw,78px)!important;
    line-height:1.04!important;
    letter-spacing:-1.8px!important;
    text-wrap:balance;
    text-shadow:0 3px 24px rgba(0,0,0,.14);
}

.publication-artikel .detail-excerpt,
.publication-kajian .detail-excerpt{
    max-width:820px;
    margin:24px 0 32px;
    color:rgba(255,255,255,.80)!important;
    font-family:var(--ak-serif)!important;
    font-size:18px!important;
    line-height:1.8!important;
}

.publication-artikel .detail-meta,
.publication-kajian .detail-meta{
    color:rgba(255,255,255,.70)!important;
}

.publication-artikel .detail-author-icon,
.publication-kajian .detail-author-icon{
    background:rgba(255,255,255,.12)!important;
}

.publication-artikel .detail-author-icon,
.publication-artikel .detail-meta-item i{
    color:#8af2c7!important;
}

.publication-kajian .detail-author-icon,
.publication-kajian .detail-meta-item i{
    color:#e4c47c!important;
}

.publication-artikel .detail-author small,
.publication-kajian .detail-author small{
    color:rgba(255,255,255,.50)!important;
}

.publication-artikel .detail-author strong,
.publication-kajian .detail-author strong{
    color:#fff!important;
    font-family:"Playfair Display",Georgia,serif!important;
    font-size:15px!important;
}

/* -----------------------------
   COVER
----------------------------- */

.publication-artikel .detail-content-section,
.publication-kajian .detail-content-section{
    padding-top:52px;
}

.publication-artikel .detail-cover,
.publication-kajian .detail-cover{
    position:relative;
    max-width:1080px;
    margin:0 auto 52px;
    border-radius:24px;
    overflow:hidden;
    background:#dceee8;
    box-shadow:0 24px 70px rgba(3,46,36,.15);
}

.publication-artikel .detail-cover::after,
.publication-kajian .detail-cover::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,35,27,.08));
}

.publication-kajian .detail-cover{
    background:#eee5d1;
    box-shadow:0 24px 70px rgba(79,57,23,.13);
}

/* -----------------------------
   READING LAYOUT
----------------------------- */

.publication-artikel .detail-layout,
.publication-kajian .detail-layout{
    grid-template-columns:minmax(0,820px) 250px;
    gap:60px;
    justify-content:center;
}

.publication-artikel .detail-article,
.publication-kajian .detail-article{
    max-width:820px;
}

.publication-artikel .premium-publication-content,
.publication-kajian .premium-publication-content{
    color:#263f39!important;
    font-family:var(--ak-serif)!important;
    font-size:18px!important;
    line-height:1.95!important;
    letter-spacing:0!important;
}

.publication-kajian .premium-publication-content{
    color:#3c382f!important;
}

.publication-artikel .premium-publication-content p,
.publication-kajian .premium-publication-content p{
    margin:0 0 1.35em;
}

.publication-artikel .premium-publication-content h2,
.publication-artikel .premium-publication-content h3,
.publication-kajian .premium-publication-content h2,
.publication-kajian .premium-publication-content h3{
    font-family:"Playfair Display",Georgia,serif!important;
    line-height:1.25!important;
    margin:2.15em 0 .65em!important;
}

.publication-artikel .premium-publication-content h2,
.publication-artikel .premium-publication-content h3{
    color:#123e35!important;
}

.publication-kajian .premium-publication-content h2,
.publication-kajian .premium-publication-content h3{
    color:#59431e!important;
}

.publication-artikel .premium-publication-content blockquote,
.publication-kajian .premium-publication-content blockquote{
    margin:34px 0;
    padding:23px 27px;
    border-radius:0 16px 16px 0;
    font-family:"Playfair Display",Georgia,serif!important;
    font-size:20px;
    line-height:1.65;
    font-style:italic;
}

.publication-artikel .premium-publication-content blockquote{
    background:#edf8f4!important;
    color:#075b45!important;
    border-left:4px solid #087e60!important;
}

.publication-kajian .premium-publication-content blockquote{
    background:#fbf4e5!important;
    color:#59431e!important;
    border-left:4px solid #b98a38!important;
}

/* Drop cap only when the first child is actually a paragraph */
.publication-artikel .premium-publication-content>p:first-child::first-letter,
.publication-kajian .premium-publication-content>p:first-child::first-letter{
    float:left;
    margin:.08em .13em 0 0;
    padding:0;
    font-family:"Playfair Display",Georgia,serif!important;
    font-size:5.2em;
    line-height:.72;
    font-weight:700;
}

.publication-artikel .premium-publication-content>p:first-child::first-letter{
    color:#087e60!important;
}

.publication-kajian .premium-publication-content>p:first-child::first-letter{
    color:#b98a38!important;
}

/* Tables, images, code and links */
.publication-artikel .premium-publication-content img,
.publication-kajian .premium-publication-content img{
    max-width:100%;
    height:auto;
    border-radius:15px;
}

.publication-artikel .premium-publication-content table,
.publication-kajian .premium-publication-content table{
    width:100%;
    border-collapse:collapse;
    margin:28px 0;
    font-size:.92em;
}

.publication-artikel .premium-publication-content th,
.publication-artikel .premium-publication-content td,
.publication-kajian .premium-publication-content th,
.publication-kajian .premium-publication-content td{
    padding:11px 13px;
    border:1px solid rgba(3,46,36,.12);
    text-align:left;
}

.publication-artikel .premium-publication-content a{
    color:#087e60!important;
}

.publication-kajian .premium-publication-content a{
    color:#8c6524!important;
}

/* -----------------------------
   MOBILE
----------------------------- */

@media(max-width:900px){
    .publication-artikel .detail-layout,
    .publication-kajian .detail-layout{
        grid-template-columns:1fr;
    }

    .publication-artikel .detail-sidebar,
    .publication-kajian .detail-sidebar{
        display:none;
    }
}

@media(max-width:700px){
    .publication-artikel .detail-header,
    .publication-kajian .detail-header{
        padding:52px 0 56px;
    }

    .publication-artikel .detail-header h1,
    .publication-kajian .detail-header h1{
        font-size:clamp(34px,10vw,48px)!important;
        letter-spacing:-.7px!important;
    }

    .publication-artikel .detail-excerpt,
    .publication-kajian .detail-excerpt{
        font-size:15px!important;
        line-height:1.75!important;
    }

    .publication-artikel .premium-publication-content,
    .publication-kajian .premium-publication-content{
        font-size:16px!important;
        line-height:1.9!important;
    }

    .publication-artikel .premium-publication-content blockquote,
    .publication-kajian .premium-publication-content blockquote{
        padding:18px 20px;
        font-size:18px;
    }

    .publication-artikel .detail-cover,
    .publication-kajian .detail-cover{
        margin-bottom:32px;
        border-radius:18px;
    }
}
