/* ============================================================
   CTA DONASI — YAYASAN HUJJATUL ISLAM
   Editorial emerald + gold / building photography
   ============================================================ */
.donasi-cta,
.donasi-cta * { box-sizing:border-box; }

.donasi-cta {
  --gold:#e8c45b;
  --gold2:#f5dc88;
  --deep:#01281d;
  --green:#064c38;
  position:relative !important;
  width:100% !important;
  max-width:100% !important;
  min-height:520px;
  margin:58px 0 !important;
  padding:0 !important;
  overflow:hidden !important;
  isolation:isolate;
  border:1px solid rgba(232,196,91,.95) !important;
  border-radius:25px !important;
  background:linear-gradient(115deg,#01261c 0%,#034b37 57%,#086e51 100%) !important;
  color:#fff !important;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  line-height:normal !important;
  writing-mode:horizontal-tb !important;
  box-shadow:0 22px 55px rgba(0,40,28,.24),inset 0 1px 0 rgba(255,255,255,.12) !important;
}

.donasi-cta::after {
  content:"";
  position:absolute;
  inset:0;
  border-radius:25px;
  border:1px solid rgba(255,255,255,.09);
  pointer-events:none;
  z-index:30;
}

.donasi-pattern {
  position:absolute;
  inset:0 auto 0 0;
  width:22%;
  min-width:120px;
  opacity:.23;
  background-image:radial-gradient(circle at 20px 20px,transparent 0 8px,rgba(226,191,78,.38) 8.5px 9.5px,transparent 10px),radial-gradient(circle at 40px 40px,transparent 0 8px,rgba(226,191,78,.28) 8.5px 9.5px,transparent 10px);
  background-size:40px 40px;
  mask-image:linear-gradient(90deg,#000,transparent);
  -webkit-mask-image:linear-gradient(90deg,#000,transparent);
  z-index:-4;
}

.donasi-gold-curve {
  position:absolute;
  left:-165px;
  top:-120px;
  width:330px;
  height:780px;
  border-right:7px solid rgba(235,200,91,.92);
  border-radius:50%;
  transform:rotate(-6deg);
  opacity:.8;
  z-index:-2;
}

.donasi-gold-curve::after {
  content:"";
  position:absolute;
  inset:12px -18px 12px 12px;
  border-right:1px solid rgba(235,200,91,.25);
  border-radius:50%;
}

.donasi-glow { position:absolute; border-radius:50%; pointer-events:none; z-index:-2; }
.donasi-glow-1 { width:320px;height:320px;right:-120px;bottom:-150px;background:radial-gradient(circle,rgba(27,171,122,.40),transparent 70%); }
.donasi-glow-2 { width:180px;height:180px;left:20%;top:12%;background:radial-gradient(circle,rgba(236,198,87,.08),transparent 70%); }

/* PHOTO */
.donasi-building {
  position:absolute;
  top:0;
  right:0;
  width:47%;
  height:100%;
  overflow:hidden;
  z-index:-3;
  background:#0b5d46;
}
.donasi-building img {
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  opacity:.92 !important;
  filter:saturate(.9) contrast(1.05) brightness(.93) !important;
}
.donasi-building-shade {
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,#034a36 0%,rgba(3,74,54,.82) 10%,rgba(3,74,54,.35) 38%,rgba(0,32,24,.08) 72%,rgba(0,32,24,.18) 100%),linear-gradient(0deg,rgba(0,35,25,.28),transparent 48%,rgba(0,30,22,.06));
}
.donasi-building.is-empty { display:none; }

/* HEADER */
.donasi-header {
  position:relative !important;
  z-index:5;
  display:flex !important;
  align-items:center !important;
  gap:13px !important;
  width:55% !important;
  min-height:92px;
  padding:25px 26px 0 !important;
  margin:0 !important;
  writing-mode:horizontal-tb !important;
}
.donasi-brand-logo {
  position:relative;
  display:flex !important;
  align-items:center;
  justify-content:center;
  flex:0 0 55px;
  width:55px !important;
  height:55px !important;
  overflow:hidden !important;
  border-radius:9px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(233,198,91,.35);
}
.donasi-logo-image {
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
  padding:3px !important;
  border-radius:7px !important;
}
.donasi-logo-fallback { display:none; color:var(--gold); font-size:28px; }
.donasi-brand-logo.logo-fallback .donasi-logo-fallback { display:block; }
.donasi-brand-copy { min-width:0; }
.donasi-brand-name {
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  color:var(--gold2) !important;
  -webkit-text-fill-color:var(--gold2) !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(15px,2.15vw,25px) !important;
  line-height:1.1 !important;
  font-weight:700 !important;
  letter-spacing:1.7px !important;
  white-space:nowrap !important;
}
.donasi-brand-tagline {
  display:block !important;
  margin-top:5px !important;
  color:rgba(255,255,255,.82) !important;
  font-size:clamp(8px,1.1vw,12px) !important;
  line-height:1.4 !important;
  white-space:nowrap !important;
}

/* CONTENT */
.donasi-content {
  position:relative;
  z-index:5;
  display:grid;
  grid-template-columns:105px minmax(0,1fr);
  gap:18px;
  align-items:center;
  width:68%;
  min-height:245px;
  padding:20px 26px 8px !important;
  margin:0 !important;
}
.donasi-emblem {
  width:92px;
  height:112px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--gold2);
  border:1px solid rgba(234,198,91,.88);
  border-radius:26px;
  background:linear-gradient(145deg,rgba(9,102,74,.42),rgba(0,36,27,.55));
  box-shadow:0 0 0 7px rgba(229,194,82,.035),inset 0 0 0 1px rgba(255,255,255,.06);
}
.donasi-emblem-inner {
  width:70px;
  height:88px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(234,198,91,.55);
  border-radius:20px;
}
.donasi-emblem svg { width:60px !important;height:60px !important;max-width:60px !important;max-height:60px !important;display:block !important;color:inherit !important; }
.donasi-text { min-width:0; text-align:left !important; }
.donasi-kicker {
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin:0 0 13px !important;
  color:var(--gold) !important;
  -webkit-text-fill-color:var(--gold) !important;
  font-size:9px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  letter-spacing:3px !important;
  white-space:nowrap !important;
}
.donasi-title {
  display:block !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  color:#fffdf3 !important;
  -webkit-text-fill-color:#fffdf3 !important;
  background:transparent !important;
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(27px,3.55vw,48px) !important;
  font-weight:700 !important;
  line-height:.99 !important;
  letter-spacing:-1px !important;
  white-space:normal !important;
  overflow-wrap:normal !important;
  text-shadow:0 2px 15px rgba(0,0,0,.22) !important;
}
.donasi-title-rule { display:flex !important;align-items:center;gap:10px;width:82%;max-width:430px;margin:18px 0 15px; }
.donasi-title-rule i { display:block;flex:1;height:1px;background:linear-gradient(90deg,var(--gold),transparent); }
.donasi-title-rule i:last-child { background:linear-gradient(90deg,transparent,var(--gold)); }
.donasi-title-rule b { color:var(--gold);font-size:13px; }
.donasi-subtitle {
  display:block !important;
  max-width:95% !important;
  margin:0 !important;
  padding:0 !important;
  color:rgba(255,255,255,.88) !important;
  -webkit-text-fill-color:rgba(255,255,255,.88) !important;
  font-size:clamp(10px,1.25vw,15px) !important;
  line-height:1.65 !important;
  white-space:normal !important;
}

/* BUTTON */
.donasi-action {
  position:relative;
  z-index:6;
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  width:64% !important;
  min-height:88px;
  margin:0 0 22px 26px !important;
  padding:18px 24px !important;
  border:1px solid rgba(239,211,111,.95) !important;
  border-radius:17px !important;
  text-decoration:none !important;
  color:#082d20 !important;
  background:linear-gradient(135deg,#a0cf79 0%,#6ba85d 55%,#43804f 100%) !important;
  box-shadow:0 16px 35px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.68) !important;
  transition:transform .22s ease,box-shadow .22s ease;
}
.donasi-action:hover { transform:translateY(-3px);box-shadow:0 22px 42px rgba(0,0,0,.25),0 0 24px rgba(232,196,91,.12) !important; }
.donasi-action strong { display:block !important;margin:0 !important;color:#092c20 !important;font-family:Georgia,"Times New Roman",serif !important;font-size:clamp(19px,2.1vw,28px) !important;line-height:1.1 !important; }
.donasi-action small { display:block !important;margin-top:6px !important;color:#f8edb9 !important;font-size:clamp(9px,1.05vw,12px) !important;line-height:1.4 !important; }
.donasi-action svg { width:32px !important;height:32px !important;max-width:32px !important;max-height:32px !important;flex:0 0 32px !important;color:#092c20 !important; }

/* BENEFITS */
.donasi-benefits {
  position:relative;
  z-index:5;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  width:calc(100% - 52px) !important;
  margin:0 26px !important;
  padding:16px 0 20px !important;
  border-top:1px solid rgba(232,196,91,.40) !important;
}
.donasi-benefit { display:flex !important;align-items:center;gap:10px;min-width:0;padding:0 14px !important;border-right:1px solid rgba(232,196,91,.35); }
.donasi-benefit:first-child { padding-left:0 !important; }
.donasi-benefit:last-child { border-right:0; }
.donasi-benefit-icon { width:40px;height:40px;min-width:40px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(232,196,91,.82);border-radius:50%;color:var(--gold); }
.donasi-benefit-icon svg { width:26px !important;height:26px !important;max-width:26px !important;max-height:26px !important;display:block !important; }
.donasi-benefit strong { display:block !important;margin:0 0 3px !important;color:var(--gold2) !important;font-size:10px !important;line-height:1.25 !important;font-weight:700 !important; }
.donasi-benefit span { display:block !important;color:rgba(255,255,255,.72) !important;font-size:8px !important;line-height:1.45 !important; }

/* Medium article column */
@media (max-width:900px) {
  .donasi-building { width:40%; }
  .donasi-header { width:72%; }
  .donasi-content { width:78%;grid-template-columns:82px minmax(0,1fr);gap:13px; }
  .donasi-emblem { width:78px;height:96px;border-radius:22px; }
  .donasi-emblem-inner { width:60px;height:74px; }
  .donasi-emblem svg { width:51px !important;height:51px !important; }
  .donasi-action { width:73% !important; }
  .donasi-title { font-size:clamp(24px,4vw,37px) !important; }
}

/* Narrow mobile */
@media (max-width:650px) {
  .donasi-cta { min-height:0;border-radius:19px !important;margin:38px 0 !important; }
  .donasi-building { width:42%;opacity:.55; }
  .donasi-building-shade { background:linear-gradient(90deg,#034b37 0%,rgba(3,75,55,.93) 30%,rgba(3,75,55,.28) 100%); }
  .donasi-header { width:100% !important;padding:18px 17px 8px !important;gap:9px !important; }
  .donasi-brand-logo { flex-basis:43px;width:43px !important;height:43px !important; }
  .donasi-brand-name { font-size:13px !important;letter-spacing:1px !important; }
  .donasi-brand-tagline { font-size:7px !important; }
  .donasi-content { width:100% !important;grid-template-columns:72px minmax(0,1fr);gap:10px;padding:15px 17px 12px !important;min-height:205px; }
  .donasi-emblem { width:68px;height:82px;border-radius:19px; }
  .donasi-emblem-inner { width:53px;height:63px;border-radius:15px; }
  .donasi-emblem svg { width:44px !important;height:44px !important; }
  .donasi-kicker { font-size:7px !important;letter-spacing:2px !important; }
  .donasi-title { font-size:25px !important;letter-spacing:-.4px !important; }
  .donasi-title-rule { width:100%;margin:12px 0 9px; }
  .donasi-subtitle { font-size:9px !important; }
  .donasi-action { width:calc(100% - 34px) !important;min-height:70px;margin:0 17px 17px !important;padding:14px 16px !important; }
  .donasi-action strong { font-size:20px !important; }
  .donasi-action small { font-size:8px !important; }
  .donasi-action svg { width:25px !important;height:25px !important; }
  .donasi-benefits { grid-template-columns:1fr !important;width:calc(100% - 34px) !important;margin:0 17px !important;padding:7px 0 11px !important; }
  .donasi-benefit,.donasi-benefit:first-child { padding:8px 0 !important;border-right:0 !important;border-bottom:1px solid rgba(232,196,91,.16); }
  .donasi-benefit:last-child { border-bottom:0; }
}


/* ============================================================
   FINAL ISOLATION PATCH
   Memastikan CSS global halaman berita tidak merusak CTA.
   ============================================================ */

.article-content .donasi-cta,
.premium-publication-content .donasi-cta {
  display:block !important;
  position:relative !important;
  width:100% !important;
  max-width:100% !important;
  overflow:hidden !important;
  writing-mode:horizontal-tb !important;
  text-orientation:mixed !important;
}

.article-content .donasi-cta .donasi-header,
.premium-publication-content .donasi-cta .donasi-header {
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  width:55% !important;
  min-width:0 !important;
  height:auto !important;
  max-height:none !important;
  padding:25px 26px 0 !important;
  margin:0 !important;
  gap:13px !important;
  writing-mode:horizontal-tb !important;
}

.article-content .donasi-cta .donasi-brand-logo,
.premium-publication-content .donasi-cta .donasi-brand-logo {
  display:flex !important;
  flex:0 0 55px !important;
  width:55px !important;
  min-width:55px !important;
  height:55px !important;
  min-height:55px !important;
  max-width:55px !important;
  max-height:55px !important;
  overflow:hidden !important;
}

.article-content .donasi-cta .donasi-logo-image,
.premium-publication-content .donasi-cta .donasi-logo-image {
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
}

.article-content .donasi-cta .donasi-brand-copy,
.premium-publication-content .donasi-cta .donasi-brand-copy {
  display:block !important;
  flex:1 1 auto !important;
  min-width:0 !important;
  width:auto !important;
}

.article-content .donasi-cta .donasi-brand-name,
.premium-publication-content .donasi-cta .donasi-brand-name {
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:25px !important;
  line-height:1.1 !important;
  white-space:nowrap !important;
  color:#f5dc88 !important;
  -webkit-text-fill-color:#f5dc88 !important;
}

.article-content .donasi-cta .donasi-content,
.premium-publication-content .donasi-cta .donasi-content {
  display:grid !important;
  grid-template-columns:105px minmax(0,1fr) !important;
  grid-template-rows:auto !important;
  align-items:center !important;
  justify-items:stretch !important;
  gap:18px !important;
  width:68% !important;
  height:auto !important;
  min-height:245px !important;
  max-height:none !important;
  margin:0 !important;
  padding:20px 26px 8px !important;
}

.article-content .donasi-cta .donasi-emblem,
.premium-publication-content .donasi-cta .donasi-emblem {
  display:flex !important;
  grid-column:1 !important;
  grid-row:1 !important;
  width:92px !important;
  min-width:92px !important;
  max-width:92px !important;
  height:112px !important;
  min-height:112px !important;
  max-height:112px !important;
  margin:0 !important;
  align-self:center !important;
}

.article-content .donasi-cta .donasi-emblem-inner,
.premium-publication-content .donasi-cta .donasi-emblem-inner {
  display:flex !important;
  width:70px !important;
  height:88px !important;
  min-width:70px !important;
  min-height:88px !important;
  max-width:70px !important;
  max-height:88px !important;
}

.article-content .donasi-cta .donasi-emblem svg,
.premium-publication-content .donasi-cta .donasi-emblem svg {
  display:block !important;
  width:60px !important;
  height:60px !important;
  min-width:60px !important;
  min-height:60px !important;
  max-width:60px !important;
  max-height:60px !important;
  flex:0 0 60px !important;
}

.article-content .donasi-cta .donasi-text,
.premium-publication-content .donasi-cta .donasi-text {
  display:block !important;
  grid-column:2 !important;
  grid-row:1 !important;
  min-width:0 !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  text-align:left !important;
}

.article-content .donasi-cta .donasi-title,
.premium-publication-content .donasi-cta .donasi-title {
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:48px !important;
  line-height:.99 !important;
  font-weight:700 !important;
  letter-spacing:-1px !important;
  white-space:normal !important;
  color:#fffdf3 !important;
  -webkit-text-fill-color:#fffdf3 !important;
}

.article-content .donasi-cta .donasi-action,
.premium-publication-content .donasi-cta .donasi-action {
  display:flex !important;
  position:relative !important;
  align-items:center !important;
  justify-content:space-between !important;
  flex-direction:row !important;
  width:64% !important;
  height:auto !important;
  min-height:88px !important;
  max-height:140px !important;
  margin:0 0 22px 26px !important;
  padding:18px 24px !important;
  overflow:hidden !important;
}

.article-content .donasi-cta .donasi-action > div,
.article-content .donasi-cta .donasi-action > span,
.premium-publication-content .donasi-cta .donasi-action > div,
.premium-publication-content .donasi-cta .donasi-action > span {
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:calc(100% - 55px) !important;
}

.article-content .donasi-cta .donasi-action strong,
.premium-publication-content .donasi-cta .donasi-action strong {
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:28px !important;
  line-height:1.1 !important;
  color:#092c20 !important;
  -webkit-text-fill-color:#092c20 !important;
}

.article-content .donasi-cta .donasi-action small,
.premium-publication-content .donasi-cta .donasi-action small {
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  font-size:12px !important;
  line-height:1.4 !important;
}

.article-content .donasi-cta .donasi-action svg,
.premium-publication-content .donasi-cta .donasi-action svg,
.article-content .donasi-cta .donasi-action > svg,
.premium-publication-content .donasi-cta .donasi-action > svg {
  display:block !important;
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  min-height:32px !important;
  max-width:32px !important;
  max-height:32px !important;
  flex:0 0 32px !important;
  margin:0 !important;
  padding:0 !important;
  transform:none !important;
}

.article-content .donasi-cta .donasi-benefits,
.premium-publication-content .donasi-cta .donasi-benefits {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  width:calc(100% - 52px) !important;
  height:auto !important;
  margin:0 26px !important;
  padding:16px 0 20px !important;
}

.article-content .donasi-cta .donasi-benefit-icon svg,
.premium-publication-content .donasi-cta .donasi-benefit-icon svg {
  display:block !important;
  width:26px !important;
  height:26px !important;
  min-width:26px !important;
  min-height:26px !important;
  max-width:26px !important;
  max-height:26px !important;
}

@media (max-width:900px) {
  .article-content .donasi-cta .donasi-content,
  .premium-publication-content .donasi-cta .donasi-content {
    grid-template-columns:82px minmax(0,1fr) !important;
    width:78% !important;
    gap:13px !important;
  }
  .article-content .donasi-cta .donasi-title,
  .premium-publication-content .donasi-cta .donasi-title { font-size:37px !important; }
  .article-content .donasi-cta .donasi-emblem,
  .premium-publication-content .donasi-cta .donasi-emblem { width:78px !important; min-width:78px !important; max-width:78px !important; height:96px !important; min-height:96px !important; max-height:96px !important; }
  .article-content .donasi-cta .donasi-emblem-inner,
  .premium-publication-content .donasi-cta .donasi-emblem-inner { width:60px !important; height:74px !important; }
  .article-content .donasi-cta .donasi-emblem svg,
  .premium-publication-content .donasi-cta .donasi-emblem svg { width:51px !important; height:51px !important; min-width:51px !important; min-height:51px !important; max-width:51px !important; max-height:51px !important; }
}

@media (max-width:650px) {
  .article-content .donasi-cta .donasi-header,
  .premium-publication-content .donasi-cta .donasi-header { width:100% !important; padding:18px 17px 8px !important; }
  .article-content .donasi-cta .donasi-brand-logo,
  .premium-publication-content .donasi-cta .donasi-brand-logo { flex-basis:43px !important; width:43px !important; min-width:43px !important; height:43px !important; min-height:43px !important; max-width:43px !important; max-height:43px !important; }
  .article-content .donasi-cta .donasi-brand-name,
  .premium-publication-content .donasi-cta .donasi-brand-name { font-size:13px !important; }
  .article-content .donasi-cta .donasi-content,
  .premium-publication-content .donasi-cta .donasi-content { grid-template-columns:72px minmax(0,1fr) !important; width:100% !important; min-height:205px !important; padding:15px 17px 12px !important; }
  .article-content .donasi-cta .donasi-title,
  .premium-publication-content .donasi-cta .donasi-title { font-size:25px !important; }
  .article-content .donasi-cta .donasi-action,
  .premium-publication-content .donasi-cta .donasi-action { width:calc(100% - 34px) !important; min-height:70px !important; max-height:90px !important; margin:0 17px 17px !important; padding:14px 16px !important; }
  .article-content .donasi-cta .donasi-action strong,
  .premium-publication-content .donasi-cta .donasi-action strong { font-size:20px !important; }
  .article-content .donasi-cta .donasi-action svg,
  .premium-publication-content .donasi-cta .donasi-action svg { width:25px !important; height:25px !important; min-width:25px !important; min-height:25px !important; max-width:25px !important; max-height:25px !important; flex-basis:25px !important; }
}