/*
Theme Name: Governexus IBM Style
Theme URI: https://governexus.id
Author: Policy Governexus Indonesia
Description: Tema WordPress bergaya IBM Carbon Design untuk Policy Governexus Indonesia.
Version: 3.3
Text Domain: governexus

Catatan versi:
3.3 - Ikon Facebook ditambahkan di footer, tautan ke halaman Facebook
      resmi Governexus Indonesia. front-page.php disinkronkan dengan
      perubahan manual terakhir (URL flier GETP dan poster ketiga).
3.2 - Surat Bukti Submission dan Surat Pengantar Instansi kini digabung
      jadi satu surat bernomor tunggal (kode PP-PB) ketika Naskah dan
      Ringkasan Kebijakan dikirim bersamaan, bukan dua surat terpisah.
      Format ID arsip publikasi diselaraskan memakai kode PP/PB, sama
      seperti nomor surat. Naskah dengan penulis mahasiswa kini terkunci
      di status Submitted, tidak bisa naik ke Administrative Check
      sampai dosen pembimbing mengonfirmasi lewat tautan email.
3.1 - Perombakan besar sistem surat. Surat Bukti Submission, Surat
      Pengantar Instansi, dan Certificate of Publication kini benar-benar
      berformat PDF (memakai pustaka FPDF internal), bukan lagi Word,
      lengkap dengan logo dan tanda tangan Chief Operating Officer asli.
      Nomor surat mengikuti format resmi (PP/PB, bulan Romawi, tahun
      submission atau publikasi). Formulir Naskah Kebijakan diperkuat,
      validasi wajib unggah/isi editor, kata kunci SEO wajib berbentuk
      chip, email dan tips Contact Person instansi, peringatan status
      fasilitator. Seluruh sebutan merek diperbarui menjadi "Governexus
      Institute by PT Policy Governexus Indonesia" dengan tagline baru.
      Data terstruktur JSON-LD ditambahkan untuk membantu pendeteksian
      Mendeley/Zotero/Scholar.
3.0 - Pernyataan Naskah Opini diperkuat. Jawaban Ya pada "pernah
      dipublikasikan" atau "sedang dikirim ke media lain" langsung
      menolak naskah otomatis, di sisi klien maupun server. Jawaban Ya
      pada "data pihak ketiga" dan "kecerdasan artifisial" kini wajib
      disertai penjelasan detail, ditampilkan pula di layar pratinjau.
2.9 - Pop up Beranda kini mendukung beberapa poster berurutan (GETP dan
      Call for Opinion), klik gambar menuju tautan tujuan, klik area luar
      berpindah ke poster berikutnya, dilengkapi titik penanda dan
      petunjuk kecil.
2.8 - Kontras mode gelap diperbaiki untuk empat blok HTML Kustom lagi,
      Tim Ahli, Skema Level 5/6/7, dan hub Pelatihan Analisis Kebijakan
      Publik.
2.7 - Perbaikan bug serius, pop up GETP yang tersembunyi ternyata tetap
      menutupi seluruh layar dan menangkap semua klik navigasi karena
      belum diberi display:none. Kontras mode gelap diperbaiki untuk
      blok HTML Kustom bagan organisasi (gvxo-scope).
2.6 - Laman publikasi Naskah dan Ringkasan Kebijakan diperkaya menyeluruh,
      badge Policy Paper/Policy Brief, Executive Summary, kata kunci,
      panel Informasi Publikasi, tiga aksi dokumen (Baca Online/Lihat
      PDF/Unduh PDF), tombol Copy Citation, Publication Statement, dan
      Related Publications.
2.5 - Tanda tangan digital Opini memakai kanvas gambar, bukan ketik nama.
      Laman baru Panduan Desain dan Penyajian Publikasi Kebijakan,
      ditautkan berdampingan dengan Syarat Ketentuan di laman Naskah dan
      Ringkasan Kebijakan, plus kotak centang wajib di formulir pengiriman
      yang mengunci langkah berikutnya sampai kedua panduan dibaca.
2.4 - Formulir Opini diperluas jadi enam langkah resmi (data penulis lengkap,
      pernyataan naskah, pernyataan keaslian dengan tanda tangan digital,
      pratinjau sebelum kirim). Laman Syarat dan Ketentuan Naskah Kebijakan
      serta Ringkasan Kebijakan ditambahkan dan ditautkan di laman terkait.
2.3 - Hero Beranda diperkaya, gradasi mesh tiga warna Carbon, grafik tren
      kebijakan animasi gambar-sendiri, statistik hidup dari data terbit
      sungguhan dengan animasi hitung naik.
2.2 - Mode gelap dengan tombol pengalih dan penyimpanan preferensi,
      efek parallax scroll dekoratif di Beranda.
2.1 - Breadcrumb navigasi otomatis di seluruh laman.
2.0 - Sistem submission Opini, Naskah Kebijakan, Ringkasan Kebijakan lengkap
      (editor, unggah berkas, alur status, reviewer, verifikasi supervisor,
      surat Word otomatis, meta SEO/Scholar/Dublin Core, penghitung baca/unduh),
      pengerasan keamanan, dan pencarian internal.
1.0 - Rilis awal tema IBM Carbon Style.
*/

:root {
    --gvx-blue: #0f62fe;
    --gvx-blue-hover: #0353e9;
    --gvx-text-primary: #161616;
    --gvx-text-secondary: #525252;
    --gvx-border: #e0e0e0;
    --gvx-border-strong: #8d8d8d;
    --gvx-layer-01: #ffffff;
    --gvx-layer-02: #f4f4f4;
    --gvx-inverse: #161616;
}

html[data-theme="dark"] {
    --gvx-blue: #4589ff;
    --gvx-blue-hover: #6ea6ff;
    --gvx-text-primary: #f4f4f4;
    --gvx-text-secondary: #c6c6c6;
    --gvx-border: #393939;
    --gvx-border-strong: #6f6f6f;
    --gvx-layer-01: #161616;
    --gvx-layer-02: #262626;
    --gvx-inverse: #f4f4f4;
}

html[data-theme="dark"] .site-header,
html[data-theme="dark"] .gvx-breadcrumbs { background: var(--gvx-layer-01); }

html[data-theme="dark"] img { opacity: 0.92; }

/* Dua formulir besar punya variabel warna sendiri, disamakan di sini */
html[data-theme="dark"] .gvxsub-scope {
    --gvxsub-ink: #f4f4f4; --gvxsub-gray: #c6c6c6; --gvxsub-border: #393939;
    --gvxsub-border-strong: #6f6f6f; --gvxsub-layer: #262626;
}
html[data-theme="dark"] .gvxk-scope {
    --gvxk-ink: #f4f4f4; --gvxk-gray: #c6c6c6; --gvxk-border: #393939;
    --gvxk-border-strong: #6f6f6f; --gvxk-layer: #262626;
}

/* Blok HTML Kustom lama (bagan organisasi, dan sejenisnya) juga punya
   variabel warna sendiri, ditempel langsung di database, bukan di tema */
html[data-theme="dark"] .gvxo-scope {
    --gvxo-text-primary: #f4f4f4;
    --gvxo-text-secondary: #c6c6c6;
    --gvxo-border: #393939;
    --gvxo-line: #6f6f6f;
    --gvxo-layer-02: #262626;
}
html[data-theme="dark"] .gvxo-scope .gvxo-card {
    background: #1c1c1c;
}

/* Tim Ahli (gvxa-scope) */
html[data-theme="dark"] .gvxa-scope {
    --gvxa-text-primary: #f4f4f4;
    --gvxa-text-secondary: #c6c6c6;
    --gvxa-border: #393939;
    --gvxa-layer-02: #262626;
}
html[data-theme="dark"] .gvxa-scope .gvxa-card { background: #1c1c1c; }
html[data-theme="dark"] .gvxa-scope .gvxa-notice { background: #3d2c00; color: #ffd88a; border-left-color: #ff832b; }

/* Skema Level 5/6/7 (gvxs-scope, dipakai bersama ketiga laman) */
html[data-theme="dark"] .gvxs-scope {
    --gvxs-text-primary: #f4f4f4;
    --gvxs-text-secondary: #c6c6c6;
    --gvxs-border: #393939;
    --gvxs-border-strong: #6f6f6f;
    --gvxs-layer-02: #262626;
}

/* Hub Pelatihan Analisis Kebijakan Publik (gvxi-scope) */
html[data-theme="dark"] .gvxi-scope {
    --gvxi-text-primary: #f4f4f4;
    --gvxi-text-secondary: #c6c6c6;
    --gvxi-border: #393939;
}
html[data-theme="dark"] .gvxi-scope .gvxi-row { background: #1c1c1c; }
html[data-theme="dark"] .gvxsub-panel,
html[data-theme="dark"] .gvxk-panel,
html[data-theme="dark"] .gvxsub-editor,
html[data-theme="dark"] .gvxk-editor,
html[data-theme="dark"] .gvxsub-title-input,
html[data-theme="dark"] .site-search-form,
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
    background: var(--gvx-layer-01);
    color: var(--gvx-text-primary);
}

* { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

body {
    font-family: 'IBM Plex Sans', Arial, sans-serif;
    color: var(--gvx-text-primary);
    background: var(--gvx-layer-01);
    font-size: 16px;
    line-height: 1.6;
}

a { color: var(--gvx-blue); }

.gvx-container {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 24px;
}

.gvx-icon {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    vertical-align: middle;
    flex-shrink: 0;
}

/* ===== HEADER ===== */
.site-header {
    background: var(--gvx-layer-01);
    border-bottom: 1px solid var(--gvx-border);
    padding: 0 24px;
    position: relative;
    z-index: 100;
}

.site-header-inner {
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    padding: 16px 0;
}

.site-logo img {
    height: 40px;
    width: auto;
    display: block;
}

.site-nav ul {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 28px;
    margin: 0;
    padding: 0;
}

.site-nav li { position: relative; }

/* BREADCRUMB NAVIGASI */
.gvx-breadcrumbs {
    background: var(--gvx-layer-02);
    border-bottom: 1px solid var(--gvx-border);
    padding: 12px 24px;
}

.gvx-breadcrumbs ol {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.gvx-breadcrumbs li {
    font-size: 12px;
    color: var(--gvx-text-secondary);
    display: flex;
    align-items: center;
}

.gvx-breadcrumbs a {
    color: var(--gvx-text-secondary);
    text-decoration: none;
}

.gvx-breadcrumbs a:hover { color: var(--gvx-blue); text-decoration: underline; }

.gvx-breadcrumbs span[aria-current="page"] {
    color: var(--gvx-text-primary);
    font-weight: 600;
}

.gvx-breadcrumb-sep { color: var(--gvx-border); }

/* KOTAK PENCARIAN DI HEADER */
.site-search {
    position: relative;
    display: flex;
    align-items: center;
}

.site-search-toggle {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--gvx-text-primary);
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
}

.site-search-toggle:hover { background: var(--gvx-layer-02); }

/* TOMBOL MODE GELAP */
.site-theme-toggle {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--gvx-text-primary);
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
}
.site-theme-toggle:hover { background: var(--gvx-layer-02); }
.site-theme-toggle .icon-moon { display: none; }
html[data-theme="dark"] .site-theme-toggle .icon-sun { display: none; }
html[data-theme="dark"] .site-theme-toggle .icon-moon { display: block; }

.site-search-form {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    background: var(--gvx-layer-01);
    border: 1px solid var(--gvx-border);
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
    display: none;
    align-items: center;
    padding: 6px;
    width: 280px;
    z-index: 200;
}

.site-search-form.is-open { display: flex; }

.site-search-form input[type="search"] {
    flex: 1;
    border: none;
    outline: none;
    padding: 8px 10px;
    font-size: 14px;
    font-family: inherit;
}

.site-search-form button[type="submit"] {
    background: var(--gvx-blue);
    border: none;
    color: #ffffff;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: 3px;
    flex-shrink: 0;
}

@media (max-width: 600px) {
    .site-search-form { width: 240px; right: -20px; }
}

.site-nav a {
    font-size: 14px;
    color: var(--gvx-text-secondary);
    text-decoration: none;
    padding-bottom: 4px;
    border-bottom: 2px solid transparent;
}

.site-nav a:hover,
.site-nav .current-menu-item > a {
    color: var(--gvx-text-primary);
    font-weight: 600;
    border-bottom-color: var(--gvx-blue);
}

/* Dropdown otomatis jika menu punya sub-item */
.site-nav li.menu-item-has-children > ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--gvx-layer-01);
    border: 1px solid var(--gvx-border);
    min-width: 280px;
    padding: 8px 0;
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    list-style: none;
    margin: 0;
    z-index: 50;
}

.site-nav li.menu-item-has-children:hover > ul { display: block; }

.site-nav li.menu-item-has-children > ul li a {
    display: block;
    padding: 10px 18px;
    border-bottom: none;
}

.site-nav li.menu-item-has-children > ul li a:hover {
    background: var(--gvx-layer-02);
}

.nav-cta {
    background: var(--gvx-blue);
    color: #ffffff !important;
    padding: 10px 22px;
    border-radius: 6px;
    font-weight: 500 !important;
}

.nav-cta:hover { background: var(--gvx-blue-hover); }

/* ===== BUTTONS ===== */
.btn-primary {
    background: var(--gvx-blue);
    color: #ffffff;
    padding: 14px 24px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border-radius: 6px;
    border: none;
    cursor: pointer;
}

.btn-primary:hover { background: var(--gvx-blue-hover); color: #fff; }

.btn-secondary {
    border: 1px solid var(--gvx-border-strong);
    color: var(--gvx-text-primary);
    padding: 14px 24px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    border-radius: 6px;
    background: transparent;
}

.btn-secondary:hover { background: var(--gvx-layer-02); }

/* ===== HERO ===== */
.hero {
    background: var(--gvx-layer-01);
    border-bottom: 1px solid var(--gvx-border);
    padding: 72px 0;
}

/* PARALLAX SCROLL DI HERO BERANDA */
.gvx-hero-parallax {
    position: relative;
    overflow: hidden;
}

.gvx-parallax-shape {
    position: absolute;
    border-radius: 50%;
    background: var(--gvx-blue);
    opacity: 0.06;
    pointer-events: none;
    z-index: 1;
    will-change: transform;
}

.gvx-parallax-shape-1 { width: 420px; height: 420px; top: -180px; right: -120px; }
.gvx-parallax-shape-2 { width: 260px; height: 260px; bottom: -140px; right: 15%; opacity: 0.05; }
.gvx-parallax-shape-3 { width: 180px; height: 180px; top: 20%; left: -80px; opacity: 0.04; }

/* GRADASI MESH HERO, tiga warna dari palet IBM Carbon sendiri */
.gvx-hero-mesh {
    background-image:
        radial-gradient(ellipse 700px 500px at 15% -10%, rgba(15,98,254,0.10), transparent 60%),
        radial-gradient(ellipse 600px 500px at 85% 10%, rgba(138,63,252,0.08), transparent 60%),
        radial-gradient(ellipse 500px 400px at 60% 100%, rgba(8,189,186,0.07), transparent 60%);
}

html[data-theme="dark"] .gvx-hero-mesh {
    background-image:
        radial-gradient(ellipse 700px 500px at 15% -10%, rgba(69,137,255,0.14), transparent 60%),
        radial-gradient(ellipse 600px 500px at 85% 10%, rgba(138,63,252,0.12), transparent 60%),
        radial-gradient(ellipse 500px 400px at 60% 100%, rgba(8,189,186,0.10), transparent 60%);
}

.gvx-hero-grid {
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    gap: 32px;
}

@media (min-width: 900px) {
    .gvx-hero-grid { grid-template-columns: 1.1fr 0.9fr; gap: 48px; }
}

.gvx-hero-chart { width: 100%; }
.gvx-hero-chart svg { width: 100%; height: auto; display: block; }

.gvx-chart-line {
    fill: none;
    stroke-dasharray: 500;
    stroke-dashoffset: 500;
    animation: gvx-draw-line 1.8s ease-out forwards;
}
.gvx-chart-line-1 { animation-delay: 0.1s; }
.gvx-chart-line-2 { animation-delay: 0.4s; }
.gvx-chart-line-3 { animation-delay: 0.7s; }

@keyframes gvx-draw-line {
    to { stroke-dashoffset: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .gvx-chart-line { animation: none; stroke-dashoffset: 0; }
}

.gvx-stat-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    margin-top: 56px;
    padding-top: 32px;
    border-top: 1px solid var(--gvx-border);
}

.gvx-stat { display: flex; flex-direction: column; }

.gvx-stat-number {
    font-size: 40px;
    font-weight: 700;
    color: var(--gvx-text-primary);
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.gvx-stat-label {
    font-size: 13px;
    color: var(--gvx-text-secondary);
    margin-top: 8px;
}

@media (prefers-reduced-motion: reduce) {
    .gvx-parallax-shape { display: none; }
}

.label {
    font-family: monospace;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--gvx-blue);
    display: block;
    margin-bottom: 16px;
}

.hero-title {
    font-size: 44px;
    font-weight: 300;
    line-height: 1.15;
    margin: 0 0 20px 0;
    max-width: 780px;
}

.hero-desc {
    font-size: 15px;
    color: var(--gvx-text-secondary);
    line-height: 1.7;
    max-width: 680px;
    margin: 0 0 32px 0;
}

/* ===== SECTION ===== */
.section { padding: 64px 0; }
.section-alt { background: var(--gvx-layer-02); }

.section-header {
    border-bottom: 1px solid var(--gvx-border);
    padding-bottom: 20px;
    margin-bottom: 40px;
}

.section-title {
    font-size: 30px;
    font-weight: 300;
    margin: 8px 0 12px 0;
}

.section-desc {
    font-size: 14px;
    color: var(--gvx-text-secondary);
    max-width: 680px;
    line-height: 1.6;
}

/* ===== CARDS (Layanan Beranda) ===== */
.service-grid {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

@media (min-width: 1024px) {
    .service-grid { flex-direction: row; align-items: flex-start; }
}

.service-col {
    display: flex;
    flex-direction: column;
    gap: 32px;
    flex: 1;
}

.card {
    background: var(--gvx-layer-01);
    border: 1px solid var(--gvx-border);
    padding: 32px;
    display: flex;
    flex-direction: column;
}

.card:hover { border-color: var(--gvx-blue); }

.card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
}

.badge-active {
    background: #161616;
    color: #ffffff;
    font-family: monospace;
    font-size: 11px;
    padding: 4px 10px;
}

.badge-soon {
    border: 1px solid var(--gvx-border-strong);
    color: var(--gvx-text-secondary);
    font-family: monospace;
    font-size: 11px;
    padding: 4px 10px;
}

.card-title {
    font-size: 20px;
    font-weight: 500;
    margin: 0 0 12px 0;
}

.card-desc {
    font-size: 14px;
    color: var(--gvx-text-secondary);
    line-height: 1.6;
    margin-bottom: 24px;
}

.card-link {
    margin-top: auto;
    font-size: 14px;
    color: var(--gvx-blue);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 4px;
    border-top: 1px solid var(--gvx-border);
    padding-top: 16px;
}

.card-link:hover { text-decoration: underline; }

.card-soon {
    background: var(--gvx-layer-02);
    border: 1px dashed var(--gvx-border-strong);
    opacity: 0.7;
}

.locked {
    margin-top: auto;
    font-size: 14px;
    color: var(--gvx-text-secondary);
    border-top: 1px solid var(--gvx-border);
    padding-top: 16px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.subcard {
    border: 1px solid var(--gvx-border);
    padding: 16px;
    margin-bottom: 16px;
}

.subcard:hover { border-color: var(--gvx-blue); }

.subcard-label {
    font-family: monospace;
    font-size: 12px;
    color: var(--gvx-blue);
    display: block;
    margin-bottom: 4px;
}

.subcard-title {
    font-size: 14px;
    font-weight: 500;
    margin: 0 0 4px 0;
}

.subcard-desc {
    font-size: 12px;
    color: var(--gvx-text-secondary);
    line-height: 1.5;
    margin: 0;
}

/* ===== JENJANG PELATIHAN ===== */
.level-card {
    background: var(--gvx-layer-01);
    border: 1px solid var(--gvx-border);
    padding: 32px;
    margin-bottom: 32px;
}

.level-badge {
    background: #161616;
    color: #ffffff;
    font-family: monospace;
    font-size: 12px;
    padding: 5px 12px;
    display: inline-block;
    margin-bottom: 16px;
}

.level-title {
    font-size: 22px;
    font-weight: 500;
    margin: 0 0 12px 0;
}

.level-desc {
    font-size: 14px;
    color: var(--gvx-text-secondary);
    line-height: 1.7;
    margin: 0 0 24px 0;
    max-width: 720px;
}

.detail-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    border-top: 1px solid var(--gvx-border);
    padding-top: 20px;
    margin-bottom: 24px;
}

@media (min-width: 768px) {
    .detail-grid { grid-template-columns: repeat(4, 1fr); }
}

.detail-label {
    font-family: monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--gvx-blue);
    display: block;
    margin-bottom: 6px;
}

.detail-value { font-size: 14px; margin: 0; }

.unit-list {
    border-top: 1px solid var(--gvx-border);
    padding-top: 20px;
}

.unit-item {
    padding: 12px 0;
    border-bottom: 1px dashed var(--gvx-border);
    font-size: 14px;
    color: var(--gvx-text-secondary);
}

.unit-item:last-child { border-bottom: none; }

.unit-code {
    font-family: monospace;
    font-size: 12px;
    color: var(--gvx-blue);
    display: block;
    margin-bottom: 4px;
}

/* ===== NOTICE ===== */
.notice {
    font-size: 13px;
    color: #8a3b00;
    background: #fff3e0;
    border-left: 3px solid #ff832b;
    padding: 12px 16px;
    margin: 0 0 32px 0;
    max-width: 760px;
    line-height: 1.6;
}

/* ===== ORG CHART ===== */
.org-tier {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    justify-content: center;
    margin-bottom: 40px;
}

.org-card {
    background: var(--gvx-layer-01);
    border: 1px solid var(--gvx-border);
    padding: 24px;
    text-align: center;
    min-width: 240px;
    flex: 1;
    max-width: 320px;
}

.org-role {
    font-family: monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--gvx-blue);
    display: block;
    margin-bottom: 8px;
}

.org-name {
    font-size: 16px;
    font-weight: 600;
    margin: 0;
}

/* ===== PLACEHOLDER PAGES ===== */
.placeholder-box {
    background: var(--gvx-layer-02);
    border: 1px dashed var(--gvx-border-strong);
    padding: 48px 32px;
    text-align: center;
}

.placeholder-box p {
    color: var(--gvx-text-secondary);
    font-size: 14px;
    max-width: 480px;
    margin: 0 auto;
}

/* ===== FORM KONTAK ===== */
.form-row { margin-bottom: 20px; }

.form-row label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 6px;
}

.form-row input,
.form-row textarea {
    width: 100%;
    border: 1px solid var(--gvx-border-strong);
    padding: 12px 14px;
    font-size: 14px;
    font-family: inherit;
    background: var(--gvx-layer-01);
}

.form-row input:focus,
.form-row textarea:focus {
    outline: none;
    border-color: var(--gvx-blue);
}

.form-alert-success {
    background: #defbe6;
    border-left: 3px solid #24a148;
    color: #0e6027;
    padding: 12px 16px;
    margin-bottom: 24px;
    font-size: 14px;
}

.form-alert-error {
    background: #fff1f1;
    border-left: 3px solid #da1e28;
    color: #a2191f;
    padding: 12px 16px;
    margin-bottom: 24px;
    font-size: 14px;
}

/* ===== CTA ===== */
.cta-dark {
    background: #161616;
    color: #ffffff;
    padding: 56px 0;
    border-top: 4px solid var(--gvx-blue);
}

.cta-row {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
}

@media (min-width: 1024px) {
    .cta-row { flex-direction: row; align-items: center; }
}

.cta-title { font-size: 22px; font-weight: 400; margin: 0 0 8px 0; }
.cta-desc { font-size: 14px; color: #a8a8a8; max-width: 560px; margin: 0; line-height: 1.6; }

/* ===== FOOTER ===== */
.site-footer {
    background: #161616;
    color: #c6c6c6;
    padding: 64px 0 32px 0;
    border-top: 4px solid var(--gvx-blue);
}

.footer-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    margin-bottom: 48px;
}

@media (min-width: 768px) {
    .footer-grid { grid-template-columns: 2fr 1fr 1fr; }
}

.footer-brand { font-size: 18px; font-weight: 700; color: #fff; text-transform: uppercase; margin: 0 0 12px 0; }
.footer-tagline { font-size: 13px; color: #a8a8a8; margin: 0 0 16px 0; }
.footer-desc { font-size: 13px; line-height: 1.6; max-width: 400px; color: #a8a8a8; margin: 0; }

.footer-heading {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #fff;
    border-bottom: 1px solid #393939;
    padding-bottom: 8px;
    margin: 0 0 20px 0;
}

.footer-list { list-style: none; margin: 0; padding: 0; }
.footer-list li { margin-bottom: 14px; }
.footer-list a { color: #a8a8a8; text-decoration: none; font-size: 13px; }
.footer-list a:hover { color: #ffffff; }

.footer-contact {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    color: #a8a8a8;
    margin-bottom: 14px;
}

.footer-contact .gvx-icon { stroke: var(--gvx-blue); margin-top: 2px; }

.footer-social {
    display: flex;
    gap: 12px;
    margin-top: 20px;
}

.footer-social a {
    width: 38px;
    height: 38px;
    border: 1px solid #393939;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #a8a8a8;
    text-decoration: none;
}

.footer-social a:hover {
    border-color: var(--gvx-blue);
    color: #ffffff;
}

.footer-social svg {
    width: 18px;
    height: 18px;
}

/* ===== PROGRAM GRID (2 kolom Layanan) ===== */
.program-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}

@media (min-width: 768px) {
    .program-grid { grid-template-columns: 1fr 1fr; }
}

.program-card {
    background: var(--gvx-layer-01);
    border: 1px solid var(--gvx-border);
    padding: 32px;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
}

.program-card:hover { border-color: var(--gvx-blue); }

.program-card.is-soon {
    background: var(--gvx-layer-02);
    border: 1px dashed var(--gvx-border-strong);
    opacity: 0.75;
    cursor: default;
}

.program-icon-wrap {
    width: 48px;
    height: 48px;
    border: 1px solid var(--gvx-border);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.program-title {
    font-size: 20px;
    font-weight: 500;
    margin: 0 0 12px 0;
    color: var(--gvx-text-primary);
}

.program-desc {
    font-size: 14px;
    color: var(--gvx-text-secondary);
    line-height: 1.6;
    margin-bottom: 20px;
}

.program-link {
    margin-top: auto;
    font-size: 14px;
    color: var(--gvx-blue);
    display: flex;
    align-items: center;
    gap: 4px;
    border-top: 1px solid var(--gvx-border);
    padding-top: 16px;
}

/* ===== TABEL SKEMA ===== */
.scheme-meta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    border: 1px solid var(--gvx-border);
    padding: 24px;
    margin-bottom: 32px;
}

@media (min-width: 768px) {
    .scheme-meta { grid-template-columns: repeat(2, 1fr); }
}

.scheme-meta-item {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px dashed var(--gvx-border);
    font-size: 14px;
}

.scheme-meta-item span:first-child {
    color: var(--gvx-text-secondary);
}

.scheme-meta-item span:last-child {
    font-weight: 600;
    text-align: right;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 40px;
    font-size: 14px;
}

.data-table caption {
    text-align: left;
    font-family: monospace;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--gvx-blue);
    margin-bottom: 12px;
    caption-side: top;
}

.data-table th {
    background: #161616;
    color: #ffffff;
    text-align: left;
    padding: 10px 12px;
    font-weight: 500;
    font-size: 13px;
}

.data-table td {
    border-bottom: 1px solid var(--gvx-border);
    padding: 10px 12px;
    vertical-align: top;
    color: var(--gvx-text-primary);
}

.data-table tr:nth-child(even) td {
    background: var(--gvx-layer-02);
}

.data-table tfoot td {
    font-weight: 700;
    background: var(--gvx-layer-02);
    border-top: 2px solid var(--gvx-border-strong);
}

.data-table td.center { text-align: center; }

.footer-bottom {
    border-top: 1px solid #393939;
    padding-top: 24px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 12px;
    color: #a8a8a8;
}

@media (min-width: 768px) {
    .footer-bottom { flex-direction: row; justify-content: space-between; align-items: center; }
}
