/* ISLAH NEWS — shared category pages (Ringkas / Tuntas / Arkib). v3 + v5.
   Reuses tokens + islah.css masthead/footer + cathero from islah-vX.css.
   Headlines use Lora (v5) with Georgia fallback (v3) — both serif. */

/* cathero eyebrow colour per format */
.cathero__eyebrow--ringkas{background:#2b6fb0}
.cathero__eyebrow--tuntas{background:#a96f12}
.cathero__eyebrow--arkib{background:#5d5346}

/* page shell: main + sticky sidebar */
.catpage{padding:34px 0 64px}
.catpage__grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:52px;align-items:start}
.catpage__side{position:sticky;top:90px}

.catmeta{font-family:var(--disp);font-weight:600;font-size:12px;letter-spacing:.02em;color:#5b574e;text-transform:uppercase}

/* serif headline group */
.fhero__title,.qitem__title,.tcard__title,.tl__title{font-family:"Lora",Georgia,"Times New Roman",serif;font-weight:700;color:var(--ink)}

/* ---- FEATURE HERO (60/40) ---- */
.fhero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:36px;align-items:center;
  padding-bottom:36px;margin-bottom:12px;border-bottom:2px solid var(--ink)}
.fhero__media{display:block}
.fhero__media .ph{border-radius:4px}
.fhero__body{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.fhero__title{font-size:31px;line-height:1.16;letter-spacing:-.01em}
.fhero__title a{color:var(--ink)}
.fhero__title a:hover{color:var(--gold-deep)}
.fhero__stand{color:var(--ink-2);font-size:16px;line-height:1.6}

/* ---- RINGKAS: quick news list (timestamp-forward) ---- */
.qlist{display:flex;flex-direction:column}
.qitem{display:grid;grid-template-columns:minmax(0,1fr) 158px;gap:32px;align-items:start;padding:24px 0;border-top:1px solid var(--line)}
.qitem:first-child{border-top:0}
.qitem__time{font-family:var(--disp);font-weight:700;font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:#2b6fb0;display:block;margin-bottom:8px}
.qlist--arkib .qitem__time{color:#5d5346}
.qitem__title{font-size:20px;line-height:1.34;margin-bottom:7px}
.qitem__title a{color:var(--ink)}
.qitem__title a:hover{color:var(--gold-deep)}
.qitem__stand{color:var(--muted);font-size:14px;line-height:1.55;max-width:62ch}
.qitem__thumb{display:block}
.qitem__thumb .ph{border-radius:3px}

/* ---- TUNTAS: in-depth feature grid ---- */
.tgrid{display:grid;grid-template-columns:1fr 1fr;gap:40px 36px}
.tcard__media{display:block;margin-bottom:14px}
.tcard__media .ph{border-radius:4px}
.tcard__title{font-size:21px;line-height:1.3;letter-spacing:-.005em;margin-bottom:10px}
.tcard__title a{color:var(--ink)}
.tcard__title a:hover{color:var(--gold-deep)}
.tcard__stand{color:var(--muted);font-size:14.5px;line-height:1.55;margin-bottom:12px}
.tcard__meta{display:flex;gap:8px;font-family:var(--disp);font-weight:600;font-size:12.5px;color:#5b574e}
.tcard__meta .read{color:#a96f12;font-weight:700}

/* ---- ARKIB: chronology timeline ---- */
.timeline{position:relative;padding-left:34px}
.timeline::before{content:"";position:absolute;left:6px;top:8px;bottom:10px;width:2px;background:var(--line)}
.tl{position:relative;padding-bottom:34px}
.tl:last-child{padding-bottom:0}
.tl::before{content:"";position:absolute;left:-34px;top:5px;width:15px;height:15px;border-radius:50%;background:#5d5346;border:3px solid var(--bg);box-shadow:0 0 0 1px var(--line)}
.tl__year{font-family:var(--disp);font-weight:800;font-size:13px;letter-spacing:.07em;color:#5d5346;margin-bottom:6px}
.tl__title{font-size:20px;line-height:1.32;margin-bottom:7px}
.tl__title a{color:var(--ink)}
.tl__title a:hover{color:var(--gold-deep)}
.tl__stand{color:var(--muted);font-size:14px;line-height:1.55;max-width:66ch}

/* ---- sidebar boxes ---- */
.sbox{background:var(--bg-warm);border-radius:10px;padding:24px 26px 28px;border-top:3px solid var(--gold)}
.sbox--ringkas{border-top-color:#2b6fb0}
.sbox--tuntas{border-top-color:#a96f12}
.sbox--arkib{border-top-color:#5d5346}
.sbox__hdr{font-family:var(--disp);font-weight:800;font-size:14px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);margin-bottom:14px}
.sbox__list{list-style:none;counter-reset:s}
.sbox__item{padding:13px 0;border-top:1px solid var(--line)}
.sbox__item:first-child{border-top:0;padding-top:0}
.sbox__item a{display:flex;gap:14px;font-family:var(--disp);font-weight:600;font-size:14.5px;line-height:1.34;color:var(--ink)}
.sbox__item a:hover{color:var(--gold-deep)}
.sbox--rank .sbox__item a::before{counter-increment:s;content:counter(s);font-weight:800;color:#c5821a;font-size:17px;flex-shrink:0;min-width:18px}
.sbox__by{display:block;font-weight:500;font-size:12px;color:var(--muted);margin-top:3px}
.sbox__author{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.sbox__author:first-child{border-top:0;padding-top:0}
.sbox__author .ph{border-radius:50%}
.sbox__author b{font-family:var(--disp);font-weight:700;font-size:14px;color:var(--ink);display:block}
.sbox__author span{font-size:12px;color:var(--muted)}

/* ---- responsive ---- */
@media(max-width:900px){ .catpage__grid{grid-template-columns:1fr;gap:44px} .catpage__side{position:static} }
@media(max-width:720px){
  .fhero{grid-template-columns:1fr;gap:22px}
  .fhero__title{font-size:25px}
  .qitem{grid-template-columns:1fr 120px;gap:18px}
  .tgrid{grid-template-columns:1fr}
}