/* =========================================================
   Radar Aqil Rubrik v16.7 — 2026-09-30
   HD source, zero text leak, opaque dark mode, tighter viewport.
   ========================================================= */

.radarSite .raRubricFinalSection{
  margin-top:10px!important;
  margin-bottom:10px!important;
}
.radarSite .raRubricFinalSection .raSectionHead{margin-bottom:6px!important}
.radarSite .raRubricFinalSection .raSectionHead span{margin-bottom:2px!important}
.radarSite .raRubricFinalSection .raSectionHead h2{
  font-size:clamp(24px,2.25vw,33px)!important;
  line-height:1!important;
}
.radarSite .raRubricFinalGrid{gap:6px!important}
.radarSite .raRubricFinalCard{
  height:clamp(82px,9.2vh,92px)!important;
  border-radius:16px!important;
}
.radarSite .raRubricFinalTitle{
  z-index:5!important;
  width:40%!important;
  padding-left:clamp(16px,1.55vw,23px)!important;
  font-size:clamp(21px,1.58vw,25px)!important;
  line-height:.98!important;
}

/* The seam is blended by the card itself. The bitmap is never faded. */
.radarSite .raRubricFinalCard::after{
  z-index:4!important;
  background:linear-gradient(90deg,
    rgba(255,255,255,1) 0%,
    rgba(255,255,255,1) 42%,
    rgba(255,255,255,.99) 49%,
    rgba(255,255,255,.90) 55%,
    rgba(255,255,255,.48) 61%,
    rgba(255,255,255,0) 68%)!important;
}
html[data-theme="dark"] .radarSite .raRubricFinalCard::after{
  background:linear-gradient(90deg,
    rgba(16,43,70,1) 0%,
    rgba(16,43,70,1) 42%,
    rgba(16,43,70,.99) 49%,
    rgba(16,43,70,.92) 55%,
    rgba(16,43,70,.50) 61%,
    rgba(16,43,70,0) 68%)!important;
}

/* No global transparency or dimming in dark mode. */
.radarSite .raRubricFinalVisual,
html[data-theme="dark"] .radarSite .raRubricFinalVisual{
  z-index:2!important;
  top:50%!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  image-rendering:auto!important;
  backface-visibility:hidden!important;
}

/* Original HD transparent objects. */
.radarSite .raRubricFinalVisual--object{
  width:auto!important;
  height:215%!important;
  max-width:none!important;
  max-height:none!important;
  right:-2%!important;
  object-fit:contain!important;
  object-position:right center!important;
  transform:translateY(-50%)!important;
  clip-path:none!important;
  -webkit-clip-path:none!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
.radarSite .raRubricFinalCard--lalu-lintas .raRubricFinalVisual--object{
  right:-5%!important;
  height:225%!important;
}
.radarSite .raRubricFinalCard--beda-arah .raRubricFinalVisual--object{
  right:-1%!important;
  height:212%!important;
}

/* Raster references stay near/below native pixel size.
   Left-side baked title/subtitle/CTA is removed with a hard crop. */
.radarSite .raRubricFinalVisual--raster{
  right:-1%!important;
  width:60%!important;
  height:auto!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:right center!important;
  transform:translateY(-50%)!important;
  clip-path:inset(0 0 0 57%)!important;
  -webkit-clip-path:inset(0 0 0 57%)!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
.radarSite .raRubricFinalCard--karya .raRubricFinalVisual--raster{
  clip-path:inset(0 0 0 58%)!important;
  -webkit-clip-path:inset(0 0 0 58%)!important;
}
.radarSite .raRubricFinalCard--sosok .raRubricFinalVisual--raster,
.radarSite .raRubricFinalCard--guyon .raRubricFinalVisual--raster,
.radarSite .raRubricFinalCard--islam .raRubricFinalVisual--raster{
  width:55%!important;
  clip-path:inset(0 0 0 56%)!important;
  -webkit-clip-path:inset(0 0 0 56%)!important;
}

/* Never scale a bitmap on hover. */
.radarSite .raRubricFinalCard:hover .raRubricFinalVisual{
  transform:translateY(-50%) translateX(-2px)!important;
}

@media(max-width:1050px){
  .radarSite .raRubricFinalCard{
    height:78px!important;
    border-radius:14px!important;
  }
  .radarSite .raRubricFinalTitle{
    width:41%!important;
    font-size:20px!important;
    padding-left:15px!important;
  }
  .radarSite .raRubricFinalVisual--object{height:220%!important}
  .radarSite .raRubricFinalVisual--raster{
    width:58%!important;
    clip-path:inset(0 0 0 59%)!important;
    -webkit-clip-path:inset(0 0 0 59%)!important;
  }
  .radarSite .raRubricFinalCard--sosok .raRubricFinalVisual--raster,
  .radarSite .raRubricFinalCard--guyon .raRubricFinalVisual--raster,
  .radarSite .raRubricFinalCard--islam .raRubricFinalVisual--raster{
    width:53%!important;
    clip-path:inset(0 0 0 58%)!important;
    -webkit-clip-path:inset(0 0 0 58%)!important;
  }
}

@media(max-width:620px){
  .radarSite .raRubricFinalSection{
    margin-top:7px!important;
    margin-bottom:7px!important;
  }
  .radarSite .raRubricFinalSection .raSectionHead{margin-bottom:4px!important}
  .radarSite .raRubricFinalSection .raSectionHead h2{
    font-size:clamp(20px,5.8vw,23px)!important;
  }
  .radarSite .raRubricFinalGrid{gap:4px!important}
  .radarSite .raRubricFinalCard{
    height:64px!important;
    border-radius:12px!important;
  }
  .radarSite .raRubricFinalTitle{
    width:43%!important;
    padding-left:12px!important;
    font-size:17px!important;
  }
  .radarSite .raRubricFinalCard::after{
    background:linear-gradient(90deg,
      rgba(255,255,255,1) 0%,
      rgba(255,255,255,1) 44%,
      rgba(255,255,255,.99) 50%,
      rgba(255,255,255,.88) 56%,
      rgba(255,255,255,.42) 62%,
      rgba(255,255,255,0) 69%)!important;
  }
  html[data-theme="dark"] .radarSite .raRubricFinalCard::after{
    background:linear-gradient(90deg,
      rgba(16,43,70,1) 0%,
      rgba(16,43,70,1) 44%,
      rgba(16,43,70,.99) 50%,
      rgba(16,43,70,.90) 56%,
      rgba(16,43,70,.44) 62%,
      rgba(16,43,70,0) 69%)!important;
  }
  .radarSite .raRubricFinalVisual--object{
    height:225%!important;
    right:-4%!important;
  }
  .radarSite .raRubricFinalCard--beda-arah .raRubricFinalVisual--object{
    right:-1%!important;
  }
  .radarSite .raRubricFinalVisual--raster{
    width:57%!important;
    right:-1%!important;
    clip-path:inset(0 0 0 60%)!important;
    -webkit-clip-path:inset(0 0 0 60%)!important;
  }
  .radarSite .raRubricFinalCard--karya .raRubricFinalVisual--raster{
    clip-path:inset(0 0 0 61%)!important;
    -webkit-clip-path:inset(0 0 0 61%)!important;
  }
  .radarSite .raRubricFinalCard--sosok .raRubricFinalVisual--raster,
  .radarSite .raRubricFinalCard--guyon .raRubricFinalVisual--raster,
  .radarSite .raRubricFinalCard--islam .raRubricFinalVisual--raster{
    width:52%!important;
    clip-path:inset(0 0 0 59%)!important;
    -webkit-clip-path:inset(0 0 0 59%)!important;
  }
}

@media(max-width:390px){
  .radarSite .raRubricFinalCard{height:59px!important}
  .radarSite .raRubricFinalTitle{
    font-size:16px!important;
    padding-left:11px!important;
  }
}


/* Radar rich article content v2 */
.raArticleBody .raInlineFigure{margin:28px 0}
.raArticleBody .raInlineFigure img{display:block;width:100%;height:auto;max-height:760px;object-fit:contain;border-radius:12px;background:#f3f5f7}
.raArticleBody .raInlineFigure figcaption{margin-top:8px;color:#6b7683;font-size:11px;line-height:1.55}
.raReferenceList{display:grid;gap:8px;margin:10px 0 0;padding:0}
.raReferenceList li,.raReferenceList p{list-style:none;margin:0;padding-left:22px;text-indent:-22px;line-height:1.65}
html[data-theme="dark"] .raArticleBody .raInlineFigure img{background:#10161d}
html[data-theme="dark"] .raArticleBody .raInlineFigure figcaption{color:#aab5c0}

/* Article cover focus/zoom parity with writer preview */
.raArticleHeroMedia{overflow:hidden;border-radius:14px;background:#f3f5f7}
.raArticleHeroMedia img{display:block;width:100%;max-height:520px;object-fit:cover;border-radius:0!important;will-change:transform}
html[data-theme="dark"] .raArticleHeroMedia{background:#10161d}


/* Radar article body semantic formatting — editor v2.7 */
.raArticleBody blockquote{
  margin:1.5em 0;
  padding:12px 0 12px 20px;
  border:0;
  border-left:4px solid var(--ra-blue,#0b5ca8);
  background:transparent;
  color:var(--ra-muted,#667085);
  font-style:normal;
}
.raArticleBody blockquote[dir="rtl"]{
  padding:12px 20px 12px 0;
  border-left:0;
  border-right:4px solid var(--ra-blue,#0b5ca8);
}
.raArticleBody ul,.raArticleBody ol{
  margin:0 0 1.4em;
  padding-left:0;
  padding-inline-start:1.7em;
}
.raArticleBody li{margin:.38em 0;color:var(--ra-ink)}
.raArticleBody [dir="rtl"]{text-align:right}
.raArticleBody [dir="ltr"]{text-align:left}


/* Article inline media & editorial interruptions — v17.1 */
.raArticleBody figure.raInlineFigure{
  width:min(100%,560px);
  max-width:560px;
  margin:26px auto;
  padding:0;
  border:0;
  background:transparent;
}
.raArticleBody figure.raInlineFigure img{
  display:block;
  width:100%;
  height:auto;
  max-height:420px;
  object-fit:contain;
  border-radius:6px;
  background:transparent;
}
.raArticleBody figure.raInlineFigure figcaption{
  margin-top:7px;
  font-size:12px;
  line-height:1.5;
  text-align:left;
  color:var(--ra-muted);
}
.raInlineRecommendation{
  display:grid;
  gap:4px;
  margin:30px 0;
  padding:14px 0;
  border-top:1px solid var(--ra-line);
  border-bottom:1px solid var(--ra-line);
}
.raInlineRecommendation span{
  font-size:10px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:var(--ra-blue);
}
.raInlineRecommendation a{
  color:var(--ra-ink)!important;
  text-decoration:none!important;
  font-size:16px;
  font-weight:850;
  line-height:1.35;
}
.raInlineRecommendation a:hover{text-decoration:underline!important}
.raInlineRecommendation small{
  font-size:10.5px;
  color:var(--ra-muted);
}
.raInlineRecommendation.is-editor-pick span{color:#9a6a00}

@media(max-width:620px){
  .raArticleBody figure.raInlineFigure{
    width:100%;
    margin:22px auto;
  }
  .raArticleBody figure.raInlineFigure img{max-height:340px}
  .raInlineRecommendation{margin:24px 0;padding:12px 0}
  .raInlineRecommendation a{font-size:15px}
}

/* Rubric detail filters: subrubrics or manuscript types, never duplicate rubric nav. */
.raSectionFilterTabs{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:9px;
  margin:6px 0 28px;
}
.raSectionFilterTabs a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:39px;
  padding:9px 16px;
  border:1px solid var(--ra-line,#d6e2ed);
  border-radius:999px;
  background:transparent;
  color:var(--ra-blue,#0b4f9c);
  font-size:13px;
  font-weight:750;
  line-height:1.35;
  text-decoration:none;
  transition:background-color .16s ease,color .16s ease,border-color .16s ease;
}
.raSectionFilterTabs a[aria-current="page"]{
  background:#0b4f9c;
  border-color:#0b4f9c;
  color:#fff!important;
}
.raSectionFilterTabs a:focus-visible{
  outline:2px solid var(--ra-yellow,#f4db39);
  outline-offset:3px;
}
html[data-theme="dark"] .radarSite .raSectionFilterTabs a:not([aria-current="page"]){
  color:#d7e8ff;
  border-color:#52647e;
}
html[data-theme="dark"] .radarSite .raSectionFilterTabs a[aria-current="page"]{
  color:#fff!important;
  border-color:#468fda;
  background:#185b9e;
}
@media (max-width:620px){
  .raSectionFilterTabs{gap:8px;margin-bottom:22px}
  .raSectionFilterTabs a{padding:8px 13px;min-height:38px;font-size:12.5px}
}