.elementor-12093 .elementor-element.elementor-element-7a75f47{--display:flex;}@media(min-width:768px){.elementor-12093 .elementor-element.elementor-element-7a75f47{--content-width:1058px;}}/* Start custom CSS for html, class: .elementor-element-22172a5 *//* =========================================================
   SDG Posts – Custom CSS
   Paste ke: Appearance → Customize → Additional CSS
   (atau file CSS tema). Berlaku untuk semua postingan
   yang dibungkus <div class="sdg-post">.
   ========================================================= */

.sdg-post { font-family: inherit; line-height: 1.7; color: #1f2937; }
.sdg-post .doc-header { background: #f1f5f9; border-left: 4px solid #19486a; padding: .9rem 1.1rem; border-radius: 6px; margin: 0 0 1.5rem; }
.sdg-post .doc-header p { margin: .1rem 0; }
.sdg-post .doc-header .doc-title { font-size: 1.35rem; font-weight: 700; color: #19486a; line-height: 1.35; }
.sdg-post .doc-header .doc-kicker { font-size: .9rem; font-weight: 600; color: #4b5563; text-transform: uppercase; letter-spacing: .03em; }
.sdg-post .doc-header .doc-meta { font-size: .92rem; color: #4b5563; }
.sdg-post h2 { font-size: 1.7rem; margin: 0 0 .25rem; color: #19486a; }
.sdg-post h3 { font-size: 1.3rem; margin: 2.25rem 0 .75rem; padding-bottom: .4rem; border-bottom: 2px solid #e5e7eb; color: #19486a; }
.sdg-post h4 { font-size: 1.05rem; margin: 1.4rem 0 .4rem; color: #111827; }
.sdg-post h5 { font-size: .98rem; margin: 1.1rem 0 .35rem; color: #374151; font-weight: 700; }
.sdg-post p { margin: 0 0 .9rem; }
.sdg-post a { color: #0b5ed7; word-break: break-word; }
.sdg-post .subtitle { font-size: 1rem; color: #4b5563; margin: 0 0 1.25rem; }

/* ---------- Foto tunggal: tidak terlalu besar, di tengah ---------- */
.sdg-post figure {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 520px !important;
  margin: 1.25rem auto 1.5rem !important;
  text-align: center !important;
}
.sdg-post figure img {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
  border-radius: 6px;
  border: 1px solid #e5e7eb;
}
.sdg-post figure.fig-tall { max-width: 420px !important; }   /* foto/gambar portrait */
.sdg-post figcaption { display: block !important; font-size: .85rem; color: #6b7280; text-align: center !important; margin: .4rem auto 0 !important; font-style: italic; }

/* ---------- 2 atau 3 foto sejajar: sama besar ---------- */
.sdg-post .fig-row {
  display: grid !important;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;            /* semua kolom lebar sama */
  gap: 1rem;
  align-items: start;
  max-width: 860px;
  margin: 1.25rem auto 1.5rem;
}
.sdg-post .fig-row figure { max-width: none !important; width: 100% !important; margin: 0 !important; }
.sdg-post .fig-row figure img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3;               /* kotak foto sama tinggi */
  object-fit: contain;               /* foto tidak terpotong */
  background: #f3f4f6;
}
.sdg-post .fig-row.portrait { max-width: 560px; }
@media (max-width: 640px) {
  .sdg-post .fig-row { grid-auto-flow: row; grid-template-columns: 1fr; }
}

/* ---------- Link / keterangan di bawah foto ---------- */
.sdg-post .fig-link { font-size: .82rem; color: #6b7280; text-align: center; margin: -.75rem auto 1.5rem; max-width: 720px; word-break: break-word; }
.sdg-post .fig-caption { font-size: .85rem; color: #6b7280; text-align: center; margin: -.75rem auto 1.5rem; font-style: italic; max-width: 860px; }

/* ---------- Logo dokumen ---------- */
.sdg-post figure.doc-logo { max-width: 260px !important; margin: 0 0 1rem !important; text-align: left !important; }
.sdg-post figure.doc-logo img { margin: 0 !important; border: 0; border-radius: 0; }

/* ---------- Tabel ---------- */
.sdg-post .table-wrap { overflow-x: auto; margin: .5rem 0 .3rem; }
.sdg-post table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.sdg-post th { background: #19486a; color: #fff; text-align: left; padding: .55rem .7rem; font-weight: 600; vertical-align: bottom; }
.sdg-post td { padding: .5rem .7rem; border-bottom: 1px solid #e5e7eb; vertical-align: top; }
.sdg-post tr:nth-child(even) td { background: #f8fafc; }
.sdg-post td.c, .sdg-post th.c { text-align: center; }
.sdg-post table.table-sm { font-size: .8rem; }
.sdg-post table.table-sm td, .sdg-post table.table-sm th { padding: .45rem .5rem; }
.sdg-post table.table-sm td.url { min-width: 180px; word-break: break-all; }
.sdg-post .tcap { font-size: .9rem; color: #19486a; font-weight: 600; margin: 1.25rem 0 .3rem; }
.sdg-post .tnote { font-size: .82rem; color: #6b7280; font-style: italic; text-align: center; margin: .3rem 0 1.25rem; }

/* ---------- Referensi ---------- */
.sdg-post .refs p { font-size: .88rem; color: #4b5563; margin: 0 0 .45rem; }

/* ---------- Grafik/chart lebar ---------- */
.sdg-post figure.fig-chart { max-width: 760px !important; }

/* ---------- Tabel: paksa tampil walau tema meng-override ---------- */
.sdg-post .table-wrap { display: block !important; width: 100% !important; overflow-x: auto !important; }
.sdg-post table { display: table !important; width: 100% !important; visibility: visible !important; border-collapse: collapse !important; }
.sdg-post table tr { display: table-row !important; }
.sdg-post table th, .sdg-post table td { display: table-cell !important; }

/* ---------- Hero halaman SDG Report (judul kiri, badge kanan, foto bawah) ---------- */
.sdg-post .report-hero { display: flex !important; align-items: center; justify-content: space-between; gap: 1.5rem; margin: 1rem 0 1.5rem; }
.sdg-post .report-hero-text { flex: 1 1 auto; border-bottom: 2px solid #9ca3af; padding-bottom: .6rem; }
.sdg-post .report-hero-text h2 { font-size: 2.4rem !important; font-weight: 700 !important; color: #1f3864 !important; margin: 0 0 .6rem !important; line-height: 1.15; }
.sdg-post .report-hero-text .subtitle { font-size: .95rem; color: #4b5563; margin: 0 !important; letter-spacing: .02em; }
.sdg-post img.report-hero-badge { flex: 0 0 auto; width: 175px !important; max-width: 32% !important; height: auto !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important; }
.sdg-post figure.report-hero-photo { max-width: 100% !important; margin: 0 0 2rem !important; }
@media (max-width: 560px) {
  .sdg-post .report-hero { flex-direction: column-reverse; align-items: flex-start; }
  .sdg-post .report-hero-text { width: 100%; }
  .sdg-post .report-hero-text h2 { font-size: 1.9rem !important; }
  .sdg-post img.report-hero-badge { width: 130px !important; max-width: 50% !important; }
}


/* =========================================================
   SDG Landing Page – Custom CSS
   Berlaku untuk <div class="sdg-landing">
   Navigasi pakai anchor URL: .../the-sustainability-impact-ratings/#sdg-17
   ========================================================= */

.sdg-landing { font-family: inherit; color: #333; }
.sdg-landing .sdg-anchor, .sdg-landing .sdg-anchor-all { display: block; height: 0; scroll-margin-top: 120px; }

/* ---------- Tab ikon SDG ---------- */
.sdg-landing .sdg-tabs { display: grid; grid-template-columns: repeat(17, 1fr); gap: 10px; margin: 0 0 2rem; padding: 0; }
.sdg-landing .sdg-tab {
  display: block !important; cursor: pointer; margin: 0 !important; padding: 0 !important;
  opacity: 1; transition: opacity .2s, transform .2s; border-radius: 3px; line-height: 0;
  text-decoration: none !important; border: 0 !important;
}
.sdg-landing .sdg-tab img { display: block !important; width: 100% !important; height: auto !important; margin: 0 !important; border-radius: 3px; box-shadow: 0 2px 4px rgba(0,0,0,.25); }
.sdg-landing .sdg-tab:hover { opacity: 1 !important; transform: translateY(-3px); }

/* ---------- Panel ---------- */
.sdg-landing .sdg-panel { display: none; }
.sdg-landing .sdg-panel-0 { display: block; }

/* ---------- Link "Reported" di dalam dropdown ---------- */
.sdg-landing a.sdg-report { color: #0b6fc7 !important; text-decoration: none !important; font-weight: 600; }
.sdg-landing a.sdg-report:hover { text-decoration: underline !important; }

/* ---------- Breadcrumb navigasi ---------- */
.sdg-landing .sdg-crumb { background: #f4f4f4; padding: .75rem 1rem; border-radius: 4px; margin: 0 0 2.5rem; font-size: .95rem; color: #333; }
.sdg-landing .sdg-crumb a { color: #333 !important; text-decoration: none !important; display: inline !important; margin: 0 !important; }
.sdg-landing .sdg-crumb a:hover { color: #0b6fc7 !important; text-decoration: underline !important; }
.sdg-landing .sdg-sep { color: #bbb; margin: 0 .6rem; }
.sdg-landing .sdg-current { color: #333; }

/* ---------- Daftar (SDG & indikator) ---------- */
.sdg-landing .sdg-item { display: block; background: #fff; margin: 0 0 1rem; border-radius: 2px; box-shadow: 0 2px 6px rgba(0,0,0,.28); font-size: 1.1rem; color: #333; }
.sdg-landing a.sdg-item, .sdg-landing .sdg-plain, .sdg-landing .sdg-item summary { padding: 1.35rem 1.2rem; }
.sdg-landing a.sdg-item { color: #333 !important; text-decoration: none !important; transition: color .15s; }
.sdg-landing a.sdg-item:hover, .sdg-landing a.sdg-item:focus { color: #0b6fc7 !important; text-decoration: underline !important; }
.sdg-landing .sdg-item summary { cursor: pointer; list-style: none; position: relative; padding-right: 3rem; }
.sdg-landing .sdg-item summary::-webkit-details-marker { display: none; }
.sdg-landing .sdg-item summary::after {
  content: ""; position: absolute; right: 1.3rem; top: 50%; width: 9px; height: 9px;
  border-right: 2px solid #888; border-bottom: 2px solid #888;
  transform: translateY(-70%) rotate(45deg); transition: transform .2s;
}
.sdg-landing .sdg-item[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.sdg-landing .sdg-item summary:hover { color: #0b6fc7; }
.sdg-landing .sdg-info { padding: 1rem 1.2rem 1.3rem; font-size: .98rem; line-height: 1.65; color: #555; border-top: 1px solid #eee; }

/* ---------- Saat sebuah SDG dipilih (#sdg-n di URL) ---------- */
.sdg-landing .sdg-anchor:target ~ .sdg-tabs .sdg-tab { opacity: .55; }
.sdg-landing .sdg-anchor:target ~ .sdg-panels .sdg-panel-0 { display: none; }
.sdg-landing #sdg-1:target ~ .sdg-tabs .sdg-tab-1,
.sdg-landing #sdg-2:target ~ .sdg-tabs .sdg-tab-2,
.sdg-landing #sdg-3:target ~ .sdg-tabs .sdg-tab-3,
.sdg-landing #sdg-4:target ~ .sdg-tabs .sdg-tab-4,
.sdg-landing #sdg-5:target ~ .sdg-tabs .sdg-tab-5,
.sdg-landing #sdg-6:target ~ .sdg-tabs .sdg-tab-6,
.sdg-landing #sdg-7:target ~ .sdg-tabs .sdg-tab-7,
.sdg-landing #sdg-8:target ~ .sdg-tabs .sdg-tab-8,
.sdg-landing #sdg-9:target ~ .sdg-tabs .sdg-tab-9,
.sdg-landing #sdg-10:target ~ .sdg-tabs .sdg-tab-10,
.sdg-landing #sdg-11:target ~ .sdg-tabs .sdg-tab-11,
.sdg-landing #sdg-12:target ~ .sdg-tabs .sdg-tab-12,
.sdg-landing #sdg-13:target ~ .sdg-tabs .sdg-tab-13,
.sdg-landing #sdg-14:target ~ .sdg-tabs .sdg-tab-14,
.sdg-landing #sdg-15:target ~ .sdg-tabs .sdg-tab-15,
.sdg-landing #sdg-16:target ~ .sdg-tabs .sdg-tab-16,
.sdg-landing #sdg-17:target ~ .sdg-tabs .sdg-tab-17 { opacity: 1; transform: translateY(-3px); }
.sdg-landing #sdg-1:target ~ .sdg-panels .sdg-panel-1,
.sdg-landing #sdg-2:target ~ .sdg-panels .sdg-panel-2,
.sdg-landing #sdg-3:target ~ .sdg-panels .sdg-panel-3,
.sdg-landing #sdg-4:target ~ .sdg-panels .sdg-panel-4,
.sdg-landing #sdg-5:target ~ .sdg-panels .sdg-panel-5,
.sdg-landing #sdg-6:target ~ .sdg-panels .sdg-panel-6,
.sdg-landing #sdg-7:target ~ .sdg-panels .sdg-panel-7,
.sdg-landing #sdg-8:target ~ .sdg-panels .sdg-panel-8,
.sdg-landing #sdg-9:target ~ .sdg-panels .sdg-panel-9,
.sdg-landing #sdg-10:target ~ .sdg-panels .sdg-panel-10,
.sdg-landing #sdg-11:target ~ .sdg-panels .sdg-panel-11,
.sdg-landing #sdg-12:target ~ .sdg-panels .sdg-panel-12,
.sdg-landing #sdg-13:target ~ .sdg-panels .sdg-panel-13,
.sdg-landing #sdg-14:target ~ .sdg-panels .sdg-panel-14,
.sdg-landing #sdg-15:target ~ .sdg-panels .sdg-panel-15,
.sdg-landing #sdg-16:target ~ .sdg-panels .sdg-panel-16,
.sdg-landing #sdg-17:target ~ .sdg-panels .sdg-panel-17 { display: block; }

/* ---------- Header di halaman report (ikon = link ke landing page) ---------- */
.sdg-landing.sdg-page-head { margin-bottom: 1.5rem; }
.sdg-landing.sdg-page-head .sdg-crumb { margin-bottom: 1rem; }
.sdg-landing.sdg-page-head .sdg-tab { opacity: .55; }
.sdg-landing.sdg-page-head .sdg-tab.is-active { opacity: 1; transform: translateY(-3px); }

/* ---------- Responsif ---------- */
@media (max-width: 900px) { .sdg-landing .sdg-tabs { grid-template-columns: repeat(9, 1fr); } }
@media (max-width: 560px) {
  .sdg-landing .sdg-tabs { grid-template-columns: repeat(6, 1fr); gap: 6px; }
  .sdg-landing .sdg-item { font-size: 1rem; }
  .sdg-landing a.sdg-item, .sdg-landing .sdg-plain, .sdg-landing .sdg-item summary { padding: 1rem; }
  .sdg-landing .sdg-item summary { padding-right: 2.6rem; }
}/* End custom CSS */