.lrjz{
      --g:#1F5C3A; --g2:#2E7D50; --gd:#133D28; --gold:#E0A11B;
      --cream:#FBF4E2; --ink:#243029; --muted:#5B6660; --line:#E5EAE6;
      --bg:#F5F7F6; --tint:#EEF5F0;
      font-family:Lato,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
      color:var(--ink); max-width:1160px; margin:0 auto; padding:6px 0 10px;
      -webkit-tap-highlight-color:transparent;
    }
    .lrjz *{box-sizing:border-box}
    .lrjz button:focus,.lrjz a:focus,.lrjz input:focus{outline:none}
    .lrjz button:focus-visible,.lrjz a:focus-visible,.lrjz input:focus-visible{outline:2px solid var(--gold); outline-offset:2px}

    /* hero */
    /* hero: gradasi hijau, teks putih (kontras 5,1:1 s.d. 12,2:1), tanpa garis atas */
    .lrjz-hero{text-align:center; margin:0 auto 20px; max-width:860px;
      background:linear-gradient(135deg, var(--g2), var(--gd)); color:#fff;
      border:none; border-radius:16px; padding:24px 28px}
    .lrjz-hero h2{margin:0 0 6px; font-size:30px; color:#fff}
    .lrjz-hero h2 span{color:#fff}
    .lrjz-hero p{margin:0; color:#fff; font-size:15px}
    .lrjz-hero .ic{color:var(--gold)}
    /* ayat band */
    .lrjz-ayat{background:var(--g); border-top:4px solid var(--gold); border-radius:16px;
      padding:26px 28px; text-align:center; margin:0 auto 30px; max-width:860px}
    .lrjz-ayat .ar{margin:0 0 14px; font-size:27px; line-height:2; color:#fff; direction:rtl;
      font-family:"Traditional Arabic","Amiri","Scheherazade New",serif}
    .lrjz-ayat .tr{margin:0; font-size:14px; color:#DCEAE0; font-style:italic; line-height:1.75}
    /* edu 2 cards */
    .lrjz-edu2{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:32px}
    .lrjz-list2{list-style:none; margin:6px 0 0; padding:0}
    .lrjz-list2 li{position:relative; padding:5px 0 5px 20px; font-size:14.5px; color:var(--muted)}
    .lrjz-list2 li::before{content:""; position:absolute; left:0; top:12px; width:6px; height:6px;
      border-radius:50%; background:var(--gold)}
    #lrjz-faq .lrjz-acc-a p{padding-left:18px}

    .lrjz-grid{display:grid; grid-template-columns:1.35fr 1fr; gap:20px; align-items:start}
    .lrjz-card{background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px}
    /* judul kartu konten putih: garis kecil emas di bawahnya (bukan kartu hasil hijau) */
    .lrjz-card:not(.lrjz-out) h3::after{content:""; display:block; width:34px; height:3px;
      margin-top:8px; border-radius:2px; background:var(--gold)}

    .lrjz-head{display:flex; align-items:center; gap:12px; margin-bottom:16px}
    .lrjz-head .box{width:44px; height:44px; border-radius:11px; background:var(--tint);
      display:flex; align-items:center; justify-content:center; font-size:20px}
    .lrjz-head h3{margin:0; font-size:18px}
    .lrjz-head span{font-size:13px; color:var(--muted)}

    .lrjz-label{font-size:14px; font-weight:700; color:var(--ink); margin:0 0 8px}

    /* type grid */
    .lrjz-types{display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:20px}
    .lrjz-type{display:flex; flex-direction:column; align-items:flex-start; gap:8px;
      text-align:left; cursor:pointer; background:#fff; border:1.5px solid var(--line);
      border-radius:11px; padding:12px 11px; font-family:inherit; transition:.12s}
    .lrjz-type:hover{border-color:var(--g2)}
    .lrjz-type .lrjz-ic{width:30px; height:30px; border-radius:8px; background:var(--tint);
      display:flex; align-items:center; justify-content:center; font-size:16px}
    .lrjz-type span:last-child{font-size:13px; font-weight:600; color:var(--ink); line-height:1.25}
    .lrjz-type.is-sel{border-color:var(--gold); background:var(--cream)}
    .lrjz-type.is-sel .lrjz-ic{background:var(--gold)}

    /* fields */
    .lrjz-field{margin-bottom:14px}
    .lrjz-inwrap{display:flex; align-items:center; border:1.5px solid var(--line);
      border-radius:10px; overflow:hidden; background:#fff}
    .lrjz-inwrap:focus-within{border-color:var(--g)}
    .lrjz-inwrap .pre{padding:0 12px; color:var(--muted); font-weight:700; font-size:14px;
      background:var(--bg); align-self:stretch; display:flex; align-items:center}
    .lrjz-inwrap input{flex:1; border:none; outline:none; padding:12px 14px; font-size:15px;
      font-family:inherit; color:var(--ink); background:none; width:100%}
    .lrjz-hint{font-size:12px; color:var(--muted); margin:6px 2px 0}
    .lrjz-cek{float:right; font-size:11.5px; font-weight:600; color:var(--g); text-decoration:none;
      border:1px solid var(--line); padding:3px 10px; border-radius:20px}
    .lrjz-cek:hover{background:var(--tint); border-color:var(--g)}

    .lrjz-rates{display:flex; gap:9px; margin-bottom:14px; flex-wrap:wrap}
    .lrjz-rate{flex:1; min-width:150px; cursor:pointer; border:1.5px solid var(--line);
      border-radius:10px; padding:11px 13px; font-size:13.5px; color:var(--ink); background:#fff}
    .lrjz-rate.is-sel{border-color:var(--g); background:var(--tint); font-weight:700}
    .lrjz-rate small{display:block; color:var(--muted); font-weight:400; font-size:12px; margin-top:2px}

    .lrjz-nisab{background:var(--cream); border:1px solid #F0E4C4; border-radius:10px;
      padding:12px 14px; margin-bottom:16px; font-size:13px; color:#8a6a2e; line-height:1.6}
    .lrjz-nisab b{color:#7a5a12}

    .lrjz-actions{display:flex; gap:10px; margin-top:4px}
    .lrjz-btn{flex:1; text-align:center; cursor:pointer; font-family:inherit; font-weight:700;
      font-size:15px; padding:13px 16px; border-radius:11px; border:none; text-decoration:none;
      display:inline-block; transition:.15s}
    .lrjz-btn.primary{background:var(--g); color:#fff}
    .lrjz-btn.primary:hover{background:var(--gd)}
    .lrjz-btn.ghost{flex:0 0 auto; background:#fff; color:var(--g); border:1.5px solid var(--line)}
    .lrjz-btn.ghost:hover{border-color:var(--g)}

    /* result */
    .lrjz-res{border:1.5px dashed var(--line); border-radius:16px; padding:26px 22px; text-align:center;
      background:var(--bg); min-height:230px; display:flex; flex-direction:column; justify-content:center}
    .lrjz-res .ic{width:56px; height:56px; border-radius:14px; background:#eceeec; margin:0 auto 14px;
      display:flex; align-items:center; justify-content:center; font-size:24px}
    .lrjz-res h3{margin:0 0 6px; font-size:19px; color:var(--ink)}
    .lrjz-res p{margin:0; font-size:14px; color:var(--muted); line-height:1.6}
    /* result filled */
    .lrjz-out{border:none; text-align:left; background:var(--g); color:#fff}
    .lrjz-out .cap{font-size:13px; color:rgba(255,255,255,.8)}
    .lrjz-out .amt{font-size:34px; font-weight:800; margin:4px 0 2px; line-height:1.1}
    .lrjz-out .rate{font-size:13px; color:rgba(255,255,255,.85); margin-bottom:16px}
    .lrjz-brk{background:rgba(255,255,255,.10); border-radius:11px; padding:13px 15px; margin-bottom:16px}
    .lrjz-brk .row{display:flex; justify-content:space-between; gap:12px; font-size:13.5px; padding:3px 0}
    .lrjz-brk .row span:first-child{color:rgba(255,255,255,.82)}
    .lrjz-badge{display:inline-block; font-size:12.5px; font-weight:700; padding:5px 11px;
      border-radius:20px; margin-bottom:14px}
    .lrjz-badge.ok{background:var(--gold); color:#3a2a00}
    .lrjz-badge.no{background:rgba(255,255,255,.2); color:#fff}
    .lrjz-out .lrjz-btn{width:100%; background:#fff; color:var(--g)}
    .lrjz-out .lrjz-btn:hover{background:var(--gold); color:var(--gd)}
    .lrjz-disc{font-size:12px; color:var(--muted); margin:12px 2px 0; line-height:1.5}

    /* why */
    .lrjz-why{margin-top:34px}
    .lrjz-why h2{text-align:center; font-size:23px; margin:0 0 4px}
    .lrjz-why .sub{text-align:center; color:var(--muted); font-size:14px; margin:0 0 20px}
    .lrjz-why-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px 26px}
    .lrjz-why-item{display:flex; gap:12px}
    .lrjz-why-item .chk{flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:var(--tint);
      color:var(--g); display:flex; align-items:center; justify-content:center}
    .lrjz-why-item .chk svg{width:15px; height:15px}
    .lrjz-why-item h4{margin:0 0 3px; font-size:15px; color:var(--ink)}
    .lrjz-why-item p{margin:0; font-size:13.5px; color:var(--muted); line-height:1.55}

    /* jenis accordion */
    .lrjz-jenis{margin-top:36px}
    .lrjz-jenis h2{text-align:center; font-size:23px; margin:0 0 4px}
    .lrjz-jenis .sub{text-align:center; color:var(--muted); font-size:14px; margin:0 0 20px}
    .lrjz-acc{border:1px solid var(--line); border-radius:12px; margin-bottom:11px; background:#fff; overflow:hidden}
    .lrjz-acc-q{width:100%; cursor:pointer; background:none; border:none; font-family:inherit;
      padding:15px 18px; display:flex; align-items:center; justify-content:space-between; gap:12px; text-align:left}
    .lrjz-acc-q .lbl{display:flex; align-items:center; gap:11px; font-size:15px; font-weight:700; color:var(--ink)}
    .lrjz-acc-q .jic{width:30px; height:30px; border-radius:8px; background:var(--tint);
      display:flex; align-items:center; justify-content:center; font-size:15px}
    .lrjz-acc-q .chev{width:18px; height:18px; color:var(--g); transition:.2s; flex:0 0 auto}
    .lrjz-acc.open .chev{transform:rotate(180deg)}
    .lrjz-acc-a{max-height:0; overflow:hidden; transition:max-height .25s ease}
    .lrjz-acc-a p{margin:0; padding:0 18px 16px 59px; font-size:14px; color:var(--muted); line-height:1.65}

    /* reset warna biru bawaan Astra (button/a :hover :focus :active) di dalam .lrjz.
       Astra: button:hover/:focus = latar+border biru, teks putih; a:hover/:focus = teks biru.
       Selector (0,1,1) itu dikalahkan dengan awalan .lrjz, tanpa !important. */
    .lrjz,.lrjz *,.lrjz button,.lrjz a{-webkit-tap-highlight-color:transparent}
    .lrjz button:hover,.lrjz button:focus,.lrjz button:active,
    .lrjz a:hover,.lrjz a:focus,.lrjz a:active{box-shadow:none; text-decoration:none}

    .lrjz .lrjz-acc-q,.lrjz .lrjz-acc-q:hover,.lrjz .lrjz-acc-q:focus,.lrjz .lrjz-acc-q:active{
      background:none; color:var(--ink); border:none}
    .lrjz .lrjz-acc-q:hover .lbl,.lrjz .lrjz-acc-q:focus .lbl,.lrjz .lrjz-acc-q:active .lbl{color:var(--g)}
    .lrjz .lrjz-acc-q:hover .chev,.lrjz .lrjz-acc-q:focus .chev,.lrjz .lrjz-acc-q:active .chev{color:var(--g)}

    .lrjz .lrjz-type,.lrjz .lrjz-type:hover,.lrjz .lrjz-type:focus,.lrjz .lrjz-type:active{
      background:#fff; color:var(--ink); border-color:var(--line)}
    .lrjz .lrjz-type:hover,.lrjz .lrjz-type:focus,.lrjz .lrjz-type:active{border-color:var(--g2)}
    .lrjz .lrjz-type.is-sel,.lrjz .lrjz-type.is-sel:hover,.lrjz .lrjz-type.is-sel:focus,.lrjz .lrjz-type.is-sel:active{
      background:var(--cream); color:var(--ink); border-color:var(--gold)}

    .lrjz .lrjz-btn.primary:focus{background:var(--g); color:#fff}
    .lrjz .lrjz-btn.primary:hover,.lrjz .lrjz-btn.primary:active{background:var(--gd); color:#fff}
    .lrjz .lrjz-btn.ghost:hover,.lrjz .lrjz-btn.ghost:focus,.lrjz .lrjz-btn.ghost:active{
      background:#fff; color:var(--g); border-color:var(--g)}
    .lrjz .lrjz-out .lrjz-btn:focus{background:#fff; color:var(--g)}
    .lrjz .lrjz-out .lrjz-btn:hover,.lrjz .lrjz-out .lrjz-btn:active{background:var(--gold); color:var(--gd)}

    .lrjz .lrjz-cek:hover,.lrjz .lrjz-cek:focus,.lrjz .lrjz-cek:active{
      color:var(--g); background:var(--tint); border-color:var(--g)}

    @media(max-width:880px){
      .lrjz-grid{grid-template-columns:1fr}
      .lrjz-why-grid{grid-template-columns:1fr}
      .lrjz-types{grid-template-columns:repeat(2,1fr)}
      .lrjz-edu2{grid-template-columns:1fr}
    }
