/* Jendela Pemilu — gaya bersama halaman publik (beranda, baca, redaksi, kontak).
   Diambil apa adanya dari prototipe-jendelapemilu.html lalu dipecah menjadi
   berkas terpisah: beranda.css (beranda) dan baca.css (halaman baca).
   Gaya admin, login, dan kontak TIDAK ada di berkas ini — halaman itu memakai
   gaya sendiri di dalam berkas HTML-nya masing-masing. */

:root{
 --ink:#111111;--onink:#FFFFFF;--indigo:#111111;--amber:#FF3131;--amber-teks:#C81E1E;
 --bg:#FFFFFF;--surf:#FFFFFF;--teks:#111111;--redam:#555555;--garis:#D9D9D9;
 --hero-t:#111;--hero-m:#444;--hero-ov:linear-gradient(to top,rgba(255,255,255,.97) 8%,rgba(255,255,255,.55) 55%,rgba(255,255,255,0) 100%);
 --tautan:#111111;--fokus:#D62020;--chip:#F0F0F0;--chipt:#111111;
 --judul:'Sora',system-ui,-apple-system,'Segoe UI',sans-serif;
 --isi:'Source Serif 4',Georgia,'Times New Roman',serif;
 --ui:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}
/* Mode gelap: aturan yang sama dengan blok "@media not all" di prototipe,
   kini diaktifkan lewat tombol mode gelap (data-tema pada <html>). */
[data-tema="gelap"]{
 color-scheme:dark;
 --ink:#FFFFFF;--onink:#000000;--indigo:#FFFFFF;
 --bg:#000000;--surf:#121212;--teks:#F5F5F5;--redam:#B3B3B3;--garis:#333333;
 --hero-t:#fff;--hero-m:#E6E6E6;--hero-ov:linear-gradient(to top,rgba(0,0,0,.92),rgba(0,0,0,.15) 70%);
 --tautan:#FF6B6B;--fokus:#FF3131;--chip:#262626;--chipt:#FFFFFF;--amber-teks:#FF6B6B}
*{box-sizing:border-box}
html{scroll-padding-top:70px;color-scheme:light}
body{margin:0;background:var(--bg);color:var(--teks);font:16px/1.5 var(--ui);overflow-x:hidden}
img,svg{max-width:100%}
a{color:var(--tautan)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--fokus);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lewati{position:absolute;left:8px;top:-60px;background:var(--amber);color:#000;padding:12px 16px;font-weight:600;z-index:50;border-radius:6px}
.lewati:focus{top:8px}
.btn{min-height:44px;padding:0 18px;border:2px solid var(--ink);background:var(--ink);color:var(--onink);border-radius:8px;font:600 15px var(--judul);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.btn.l{background:transparent;color:var(--teks);border-color:var(--ink)}
.btn.a{background:var(--amber);border-color:var(--amber);color:#000}
.btn[disabled]{opacity:.6;cursor:progress}
/* header */
header.top{position:sticky;top:0;z-index:20;background:var(--surf);border-bottom:3px solid var(--amber)}
.bar{max-width:1240px;margin:auto;display:flex;align-items:center;gap:12px;padding:6px 14px;min-height:56px}
.lg{display:block;position:relative;overflow:hidden;height:32px;width:168px}
.lg img{max-width:none;position:absolute;width:136.054%;left:-16.327%;top:-292.857%}
.lg.d{display:none}
[data-tema="gelap"] .lg.t{display:none}
[data-tema="gelap"] .lg.d{display:block}
.sp{flex:1}
.ik{width:44px;height:44px;border:0;background:transparent;border-radius:8px;display:grid;place-items:center;cursor:pointer;color:var(--teks)}
.ik svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2}
.ik .ikonTerang{display:none}
[data-tema="gelap"] .ik .ikonGelap{display:none}
[data-tema="gelap"] .ik .ikonTerang{display:block}
.cari{display:none;max-width:1240px;margin:auto;padding:0 14px 10px}
.cari.open{display:block}
.cari input{width:100%;min-height:44px;padding:0 14px;border:2px solid var(--garis);border-radius:8px;background:var(--bg);color:var(--teks)}
@media (min-width:900px){.cari{display:block;max-width:340px;margin:0;padding:0;position:absolute;right:60px;top:6px}.ik.c{display:none}.bar{position:relative}}
main{max-width:1240px;margin:auto;padding:16px 14px 40px}
main:focus{outline:none}
/* kartu */
.tag{display:inline-block;font:600 12px var(--judul);color:var(--chipt);background:var(--chip);padding:3px 8px;border-radius:4px}
.lab{display:inline-block;font:600 12px var(--judul);padding:3px 8px;border-radius:4px;background:var(--amber);color:#000;margin-left:6px}
.ft{position:relative;background:linear-gradient(135deg,#F3F3F3,#DCDCDC 60%,#FFB3B3);border-radius:6px;overflow:hidden}
.ft.g1{background:linear-gradient(135deg,#FAFAFA,#E8E8E8 60%,#C4C4C4)}
.ft.g2{background:linear-gradient(160deg,#EFEFEF,#FFC4C4 130%)}
.ft.g3{background:linear-gradient(120deg,#F6F6F6,#FF9C9C 150%)}
.ft img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.kt{position:relative;background:var(--surf);border:1px solid var(--garis);border-radius:8px;display:flex;flex-direction:column;overflow:hidden}
.kt .ft{border-radius:0;aspect-ratio:16/9}
.kt .bd{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;flex:1}
.kt h3{margin:0;font:600 17px/1.35 var(--judul);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.kt h3 a{color:inherit;text-decoration:none}
.kt h3 a::after{content:"";position:absolute;inset:0}
.kt p{margin:0;color:var(--redam);font-size:15px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mt{font-size:13px;color:var(--redam);margin-top:auto;padding-top:4px}
.kt.tl{border:2px dashed var(--garis);background:transparent}
.kt.tl .bd .baca{font-weight:600;color:var(--tautan);text-decoration:underline;margin-top:auto}
.kt.own{border-top:5px solid var(--ink);box-shadow:4px 4px 0 var(--chip)}
.kt.own .by{font:600 14px var(--isi)}
.grid{display:grid;gap:14px;grid-template-columns:1fr}
/* Anak grid boleh menyusut di bawah lebar isiannya — mencegah geser
   mendatar bila judul/tautan di dalam kartu sangat panjang. */
.grid>*,.atas>*,.kolom>*{min-width:0}
@media (min-width:768px){.grid{grid-template-columns:1fr 1fr}}
@media (min-width:1280px){.grid{grid-template-columns:repeat(3,1fr)}}
.sek{font:700 18px var(--judul);margin:0 0 8px}
/* halaman teks (baca, redaksi, kontak) */
.kolom{max-width:720px;margin:auto}
.kolom h1{font:700 clamp(26px,5vw,38px)/1.2 var(--judul);margin:10px 0}
.tgl,.cap{font-size:13px;color:var(--redam)}
.by2{font:600 17px var(--isi);margin:6px 0 14px}
.pg{background:var(--surf);border:1px solid var(--garis);border-radius:8px;padding:14px;margin:10px 0}
.kosong{display:block;padding:20px;border:2px dashed var(--garis);border-radius:8px;color:var(--redam)}
.rd h2{font:700 20px var(--judul);margin:26px 0 8px}
dl{margin:0}
dt{font-weight:600}
dd{margin:0 0 10px;color:var(--redam)}
/* kotak pesan (berbagi tautan, formulir kontak) */
.st{padding:10px 12px;border-radius:8px;background:var(--chip);color:var(--chipt);font-weight:600}
.st.gagal{background:#FBE3E1;color:#8A1C14}
[data-tema="gelap"] .st.gagal{background:#4A1F1F;color:#FFC9C4}
/* footer */
footer{background:var(--bg);color:var(--teks);border-top:3px solid var(--amber);padding:22px 14px}
footer .in{max-width:1240px;margin:auto}
footer p{margin:0 0 10px;max-width:760px;font-size:14px}
footer a{color:var(--amber-teks);font-weight:600;display:inline-flex;align-items:center;min-height:44px;margin-right:16px}
[data-tema="gelap"] footer{background:#000}
[data-tema="gelap"] .ft{background:linear-gradient(135deg,#111,#4A4A4A 60%,#FF3131)}
[data-tema="gelap"] .ft.g1{background:linear-gradient(135deg,#000,#2A2A2A 60%,#8A8A8A)}
[data-tema="gelap"] .ft.g2{background:linear-gradient(160deg,#222,#C81E1E 130%)}
[data-tema="gelap"] .ft.g3{background:linear-gradient(120deg,#333,#FF3131 150%)}