/* Mushola Al Istianah */
    :root{--hijau-tua:#0d3b2e;--hijau:#14624a;--hijau-muda:#1f8a67;--emas:#c9a227;--emas-muda:#e6c85a;--krem:#f7f3e8;--teks:#22302b;--bg:#f4f6f5;}
    *{margin:0;padding:0;box-sizing:border-box;}
    body{font-family:'Segoe UI','Amiri',Tahoma,sans-serif;background:var(--bg);color:var(--teks);line-height:1.7;}
    header{background:linear-gradient(135deg,var(--hijau-tua),var(--hijau));color:#fff;position:sticky;top:0;z-index:100;box-shadow:0 2px 12px rgba(0,0,0,.2);}
    .header-inner{max-width:1200px;margin:0 auto;padding:14px 22px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
    .brand{display:flex;align-items:center;gap:12px;}
    .brand .logo{width:52px;height:52px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 3px rgba(255,255,255,.15);overflow:hidden;padding:4px;flex-shrink:0;}
    .brand .logo img{width:100%;height:100%;object-fit:contain;display:block;}
    .brand .brand-text h1{font-size:1.15rem;letter-spacing:.5px;font-weight:600;line-height:1.2;}
    .brand .brand-text span{display:block;font-size:.7rem;color:var(--emas-muda);letter-spacing:2px;text-transform:uppercase;margin-top:2px;}
    .hero-masjid{position:relative;min-height:380px;display:flex;align-items:center;justify-content:center;text-align:center;padding:70px 22px;color:#fff;overflow:hidden;background:linear-gradient(135deg,var(--hijau-tua),var(--hijau));}
    .hero-masjid.ada-gambar::before{content:"";position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;z-index:0;}
    .hero-masjid.ada-gambar::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(13,59,46,.85),rgba(13,59,46,.75));z-index:1;}
    .hero-masjid .hero-content{position:relative;z-index:2;max-width:780px;}
    .hero-masjid .bismillah{font-size:1.4rem;color:var(--emas-muda);margin-bottom:10px;}
    .hero-masjid h1{font-size:2.2rem;margin-bottom:14px;letter-spacing:1px;text-shadow:0 2px 8px rgba(0,0,0,.3);}
    .hero-masjid p{max-width:680px;margin:0 auto;color:#e8f3ee;font-size:.98rem;text-shadow:0 1px 4px rgba(0,0,0,.3);}
    .sholat-strip{background:linear-gradient(135deg,var(--hijau-tua),var(--hijau));color:#fff;position:sticky;top:80px;z-index:90;box-shadow:0 4px 14px rgba(0,0,0,.18);border-bottom:3px solid var(--emas);}
    .sholat-strip-inner{max-width:1200px;margin:0 auto;display:flex;align-items:stretch;}
    .sholat-panel{background:linear-gradient(135deg,var(--emas),#b08d1c);color:var(--hijau-tua);padding:14px 22px;display:flex;align-items:center;gap:18px;flex-shrink:0;position:relative;overflow:hidden;}
    .sholat-panel::after{content:"";position:absolute;top:-40px;right:-40px;width:120px;height:120px;background:radial-gradient(circle,rgba(255,255,255,.25),transparent 70%);border-radius:50%;}
    .sholat-panel .panel-icon{width:42px;height:42px;background:rgba(13,59,46,.15);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;}
    .sholat-panel .panel-text{position:relative;}
    .sholat-panel .panel-label{font-size:.68rem;letter-spacing:2px;text-transform:uppercase;font-weight:700;opacity:.75;margin-bottom:2px;}
    .sholat-panel .panel-shalat{font-size:1.15rem;font-weight:700;letter-spacing:.5px;line-height:1.1;margin-bottom:2px;}
    .sholat-panel .panel-jam{font-size:1.6rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:1px;line-height:1;}
    .sholat-panel .panel-countdown{font-size:.78rem;font-weight:700;background:rgba(13,59,46,.18);padding:3px 10px;border-radius:12px;margin-top:4px;display:inline-block;font-variant-numeric:tabular-nums;letter-spacing:.5px;}
    .sholat-marquee{flex:1;overflow:hidden;position:relative;display:flex;align-items:center;background:rgba(0,0,0,.08);}
    .sholat-marquee::before,.sholat-marquee::after{content:"";position:absolute;top:0;bottom:0;width:40px;z-index:2;pointer-events:none;}
    .sholat-marquee::before{left:0;background:linear-gradient(90deg,var(--hijau-tua),transparent);}
    .sholat-marquee::after{right:0;background:linear-gradient(270deg,var(--hijau-tua),transparent);}
    .sholat-marquee-track{display:inline-flex;align-items:center;gap:34px;white-space:nowrap;padding:12px 20px;font-size:.9rem;animation:marquee-scroll 40s linear infinite;will-change:transform;}
    .sholat-strip:hover .sholat-marquee-track{animation-play-state:paused;}
    @keyframes marquee-scroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
    .mq-item{display:inline-flex;align-items:center;gap:6px;color:#e8f3ee;}
    .mq-item .mq-icon{color:var(--emas-muda);}
    .mq-item strong{color:#fff;font-weight:600;}
    .mq-item em{font-style:normal;color:var(--emas-muda);font-weight:700;font-variant-numeric:tabular-nums;}
    .mq-item.mq-next{background:rgba(201,162,39,.18);border:1px solid rgba(201,162,39,.5);border-radius:20px;padding:4px 14px;}
    .mq-item.mq-next strong{color:var(--emas-muda);}
    .mq-separator{color:rgba(255,255,255,.25);}
    .pengingat-box{max-width:1200px;margin:0 auto;padding:0 22px;}
    .pengingat-card{background:#fff;border-radius:14px;padding:20px 24px;box-shadow:0 4px 18px rgba(13,59,46,.08);border:1px solid #e6ece8;display:flex;align-items:center;gap:18px;margin-top:20px;margin-bottom:28px;}
    .pengingat-icon{width:48px;height:48px;background:#fff;border:1.5px solid var(--hijau-muda);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--hijau);flex-shrink:0;}
    .pengingat-text{flex:1;line-height:1.5;}
    .pengingat-text .baris-1{color:var(--hijau-tua);font-weight:600;font-size:.98rem;}
    .pengingat-text .baris-2{color:#5a6b64;font-size:.9rem;margin-top:2px;}
    .pengingat-btn{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;background:#fff;color:var(--hijau-tua);border:1.5px solid var(--hijau-muda);border-radius:10px;font-family:inherit;font-size:.92rem;font-weight:700;cursor:pointer;transition:.25s;flex-shrink:0;white-space:nowrap;}
    .pengingat-btn:hover{background:var(--hijau);color:#fff;border-color:var(--hijau);transform:translateY(-2px);box-shadow:0 6px 16px rgba(13,59,46,.2);}
    .pengingat-btn.aktif{background:var(--hijau);color:#fff;border-color:var(--hijau);}
    .pengingat-btn.aktif:hover{background:#b91c1c;border-color:#b91c1c;box-shadow:0 6px 16px rgba(185,28,28,.25);}
    .pengingat-status{font-size:.8rem;color:#7a8b84;margin-top:6px;font-style:italic;}
    .pengingat-status.ok{color:var(--hijau);font-style:normal;font-weight:600;}
    .pengingat-status.err{color:#b91c1c;font-style:normal;}
    @media(max-width:640px){
        .pengingat-card{flex-direction:column;text-align:center;padding:20px;}
        .pengingat-btn{width:100%;justify-content:center;}
    }
    .tiga-card-wrap{max-width:1200px;margin:0 auto;padding:0 22px 32px;}
    .tiga-card{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:18px;align-items:stretch;}
    .tiga-card > div{border-radius:16px;overflow:hidden;}
    .card-wakaf{background:#fff;box-shadow:0 4px 18px rgba(13,59,46,.08);display:flex;position:relative;min-height:280px;}
    .card-wakaf .wakaf-gambar{width:42%;background:linear-gradient(135deg,#e8f0ec,#d4e5dc);position:relative;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;}
    .card-wakaf .wakaf-gambar img{width:100%;height:100%;object-fit:cover;display:block;}
    .card-wakaf .wakaf-isi{flex:1;padding:24px 22px;display:flex;flex-direction:column;}
    .card-wakaf .label-hijau{display:inline-block;background:#e8f5ee;color:var(--hijau);font-size:.72rem;font-weight:700;letter-spacing:1px;padding:5px 12px;border-radius:20px;margin-bottom:12px;align-self:flex-start;}
    .card-wakaf h4{color:var(--hijau-tua);font-size:1.15rem;line-height:1.35;margin-bottom:10px;}
    .card-wakaf .desc{color:#5a6b64;font-size:.87rem;line-height:1.55;margin-bottom:16px;flex-grow:1;}
    .card-wakaf .angka-row{display:flex;justify-content:space-between;margin-bottom:8px;font-size:.78rem;}
    .card-wakaf .angka-row .label-kecil{color:#7a8b84;letter-spacing:.5px;margin-bottom:2px;}
    .card-wakaf .angka-row .nilai{color:var(--hijau-tua);font-weight:700;font-size:.92rem;font-variant-numeric:tabular-nums;}
    .card-wakaf .progress-bar{background:#e8f0ec;height:10px;border-radius:10px;overflow:hidden;margin-bottom:8px;}
    .card-wakaf .progress-bar > div{background:linear-gradient(90deg,var(--hijau-muda),var(--hijau));height:100%;border-radius:10px;transition:width 1.2s ease;}
    .card-wakaf .progress-info{display:flex;justify-content:space-between;font-size:.75rem;color:#7a8b84;margin-bottom:16px;}
    .card-wakaf .btn-wakaf{display:block;width:100%;background:var(--hijau);color:#fff;text-align:center;padding:12px 20px;border-radius:10px;font-weight:700;font-size:.92rem;text-decoration:none;transition:.25s;margin-bottom:10px;}
    .card-wakaf .btn-wakaf:hover{background:var(--hijau-tua);transform:translateY(-2px);box-shadow:0 6px 16px rgba(13,59,46,.25);}
    .card-wakaf .link-laporan{display:block;text-align:center;color:var(--hijau);font-size:.85rem;font-weight:600;text-decoration:none;}
    .card-wakaf .link-laporan:hover{color:var(--emas);}
    .card-petugas{background:#fff;box-shadow:0 4px 18px rgba(13,59,46,.08);padding:22px 20px;display:flex;flex-direction:column;}
    .card-petugas h4{color:var(--hijau-tua);font-size:1rem;margin-bottom:14px;text-align:center;letter-spacing:.3px;}
    .toggle-petugas{display:flex;gap:6px;justify-content:center;margin-bottom:16px;}
    .toggle-petugas button{background:#f0f4f2;border:none;padding:7px 20px;border-radius:20px;font-family:inherit;font-size:.82rem;font-weight:600;color:#7a8b84;cursor:pointer;transition:.25s;}
    .toggle-petugas button.active{background:var(--hijau);color:#fff;}
    .petugas-info-hari{font-size:.82rem;color:#7a8b84;margin-bottom:14px;text-align:center;}
    .petugas-list{display:flex;flex-direction:column;gap:0;flex-grow:1;}
    .petugas-row{display:flex;align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid #f0f4f2;}
    .petugas-row:last-child{border-bottom:none;}
    .petugas-row .avatar{width:36px;height:36px;background:#e8f5ee;color:var(--hijau);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
    .petugas-row .nama{flex:1;color:var(--hijau-tua);font-weight:600;font-size:.92rem;}
    .petugas-row .role{color:#7a8b84;font-size:.82rem;font-weight:500;}
    .card-iqamah{background:linear-gradient(160deg,var(--hijau-tua),var(--hijau));color:#fff;padding:24px 22px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;}
    .card-iqamah::before{content:"";position:absolute;bottom:-40px;right:-40px;width:180px;height:180px;background:radial-gradient(circle,rgba(201,162,39,.18),transparent 70%);border-radius:50%;}
    .card-iqamah .iqamah-head{position:relative;z-index:1;}
    .card-iqamah .label-atas{font-size:.72rem;letter-spacing:2px;text-transform:uppercase;color:var(--emas-muda);font-weight:700;margin-bottom:14px;}
    .card-iqamah .label-kecil{color:#b8d4c8;font-size:.82rem;margin-bottom:4px;}
    .card-iqamah .countdown{font-size:2.6rem;font-weight:700;letter-spacing:2px;font-variant-numeric:tabular-nums;color:#fff;line-height:1;margin-bottom:14px;}
    .card-iqamah .untuk{color:#b8d4c8;font-size:.85rem;}
    .card-iqamah .untuk strong{color:#fff;font-weight:600;}
    .card-iqamah .ayat{position:relative;z-index:1;font-size:.78rem;color:#c9dcd3;font-style:italic;line-height:1.5;border-top:1px solid rgba(255,255,255,.15);padding-top:14px;margin-top:20px;}
    section{max-width:1200px;margin:0 auto;padding:56px 22px;}
    .section-title{text-align:center;margin-bottom:36px;}
    .section-title h3{font-size:1.6rem;color:var(--hijau-tua);display:inline-block;position:relative;padding-bottom:10px;letter-spacing:.5px;}
    .section-title h3::after{content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:70px;height:3px;background:var(--emas);border-radius:2px;}
    .section-title p{color:#5a6b64;margin-top:10px;font-size:.95rem;}
    .section-title .link-semua{display:inline-block;margin-top:10px;color:var(--hijau);font-size:.88rem;font-weight:600;text-decoration:none;border-bottom:1px dotted var(--emas);}
    .section-title .link-semua:hover{color:var(--emas);}
    .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;}
    .grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
    @media(max-width:1024px){.grid-4{grid-template-columns:repeat(2,1fr);}}
    @media(max-width:600px){.grid-4{grid-template-columns:1fr;}}
    .card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 4px 18px rgba(13,59,46,.08);transition:.3s;display:flex;flex-direction:column;border:1px solid #e6ece8;}
    .card:hover{transform:translateY(-4px);box-shadow:0 10px 26px rgba(13,59,46,.14);}
    .card-thumb{width:100%;height:170px;background:linear-gradient(135deg,var(--hijau),var(--hijau-tua));overflow:hidden;position:relative;}
    .card-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:.4s;}
    .card:hover .card-thumb img{transform:scale(1.06);}
    .card-inner{padding:22px 22px 24px;display:flex;flex-direction:column;flex-grow:1;}
    .card h4{color:var(--hijau-tua);margin-bottom:10px;font-size:1.1rem;}
    .card .card-summary{color:#4b5b54;font-size:.94rem;flex-grow:1;}
    .card .icon-wrap{width:44px;height:44px;background:var(--krem);border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;color:var(--hijau);}
    .card .badge-top{display:inline-block;background:var(--emas);color:var(--hijau-tua);font-size:.7rem;padding:3px 10px;border-radius:20px;font-weight:600;margin-bottom:10px;align-self:flex-start;}
    .card .meta-mini{display:flex;gap:14px;font-size:.8rem;color:var(--hijau);margin-top:12px;flex-wrap:wrap;}
    .card .meta-mini span{display:flex;align-items:center;gap:5px;}
    .kajian-filter{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:28px;}
    .kajian-filter button{background:#fff;border:1.5px solid #dbe5df;color:var(--hijau);font-size:.85rem;padding:7px 18px;border-radius:20px;cursor:pointer;transition:.25s;font-weight:500;font-family:inherit;}
    .kajian-filter button:hover{border-color:var(--emas);color:var(--emas);}
    .kajian-filter button.active{background:var(--hijau);border-color:var(--hijau);color:#fff;font-weight:600;}
    .kajian-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;}
    .kajian-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
    @media(max-width:1024px){.kajian-grid-4{grid-template-columns:repeat(2,1fr);}}
    @media(max-width:600px){.kajian-grid-4{grid-template-columns:1fr;}}
    .kajian-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 4px 18px rgba(13,59,46,.08);transition:.3s;border:1px solid #e6ece8;display:flex;flex-direction:column;}
    .kajian-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(13,59,46,.15);}
    .kajian-thumb{height:160px;overflow:hidden;background:linear-gradient(135deg,var(--hijau),var(--hijau-tua));position:relative;}
    .kajian-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:.4s;}
    .kajian-card:hover .kajian-thumb img{transform:scale(1.06);}
    .kajian-thumb .tema-badge{position:absolute;top:12px;left:12px;background:var(--emas);color:var(--hijau-tua);font-size:.7rem;font-weight:700;padding:4px 12px;border-radius:20px;letter-spacing:1px;text-transform:uppercase;box-shadow:0 2px 8px rgba(0,0,0,.2);}
    .kajian-body{padding:20px 22px;flex-grow:1;display:flex;flex-direction:column;}
    .kajian-body h4{color:var(--hijau-tua);font-size:1.05rem;margin-bottom:8px;}
    .kajian-body p{color:#4b5b54;font-size:.9rem;margin-bottom:12px;flex-grow:1;}
    .kajian-meta{display:flex;gap:14px;font-size:.8rem;color:var(--hijau);border-top:1px dashed #dbe5df;padding-top:12px;flex-wrap:wrap;margin-top:auto;}
    .kajian-meta span{display:flex;align-items:center;gap:5px;}
    .program-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;}
    .program-card{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 4px 16px rgba(13,59,46,.07);transition:.3s;position:relative;}
    .program-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(13,59,46,.15);}
    .program-thumb{height:150px;overflow:hidden;background:linear-gradient(135deg,var(--hijau),var(--hijau-tua));position:relative;}
    .program-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:.4s;}
    .program-card:hover .program-thumb img{transform:scale(1.06);}
    .program-thumb .overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(13,59,46,.7),transparent 60%);}
    .program-thumb .icon-float{position:absolute;bottom:12px;left:12px;width:44px;height:44px;background:var(--emas);color:var(--hijau-tua);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,.25);}
    .program-inner{padding:20px 22px 24px;text-align:center;}
    .program-inner h4{color:var(--hijau-tua);margin-bottom:8px;font-size:1.05rem;}
    .program-inner p{color:#5a6b64;font-size:.88rem;margin-bottom:12px;}
    .program-inner .badge-program{display:inline-block;background:var(--krem);color:var(--hijau);font-size:.72rem;padding:4px 12px;border-radius:20px;font-weight:600;border:1px solid #e6d9b8;}
    .berita-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:22px;}
    .berita-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 4px 16px rgba(13,59,46,.07);transition:.3s;display:flex;flex-direction:column;}
    .berita-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(13,59,46,.13);}
    .berita-thumb{height:160px;overflow:hidden;background:linear-gradient(135deg,var(--hijau),var(--hijau-tua));}
    .berita-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:.4s;}
    .berita-card:hover .berita-thumb img{transform:scale(1.06);}
    .berita-inner{padding:20px 22px;}
    .berita-inner .meta{display:flex;gap:12px;font-size:.78rem;color:var(--hijau);margin-bottom:10px;flex-wrap:wrap;}
    .berita-inner h4{color:var(--hijau-tua);margin-bottom:8px;font-size:1.05rem;}
    .berita-inner p{color:#4b5b54;font-size:.9rem;}
    .kontak-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:30px;align-items:start;}
    .form-box{background:#fff;border-radius:14px;padding:30px 28px;box-shadow:0 6px 20px rgba(13,59,46,.08);}
    .form-box h3{color:var(--hijau-tua);margin-bottom:6px;font-size:1.2rem;}
    .form-box .sub{color:#7a8b84;font-size:.88rem;margin-bottom:20px;}
    .form-group{margin-bottom:16px;}
    .form-group label{display:block;font-size:.85rem;color:var(--hijau-tua);font-weight:600;margin-bottom:6px;}
    .form-group input,.form-group select,.form-group textarea{width:100%;padding:11px 14px;border:1.5px solid #dbe5df;border-radius:8px;font-family:inherit;font-size:.92rem;background:#fbfdfc;transition:.2s;}
    .form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--hijau-muda);background:#fff;box-shadow:0 0 0 3px rgba(31,138,103,.1);}
    .form-group textarea{resize:vertical;min-height:90px;}
    .form-btn{background:linear-gradient(135deg,var(--hijau),var(--hijau-tua));color:#fff;border:none;padding:13px 30px;border-radius:30px;font-weight:700;cursor:pointer;font-size:.95rem;letter-spacing:.5px;transition:.25s;box-shadow:0 6px 18px rgba(13,59,46,.2);}
    .form-btn:hover{background:linear-gradient(135deg,var(--hijau-tua),var(--hijau));transform:translateY(-2px);box-shadow:0 8px 22px rgba(13,59,46,.3);}
    .testimoni-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;}
    .testimoni-card{background:#fff;border-radius:12px;padding:26px;box-shadow:0 4px 16px rgba(13,59,46,.07);border-top:4px solid var(--emas);position:relative;}
    .testimoni-card .quote-icon{color:var(--emas);margin-bottom:12px;}
    .testimoni-card .quote-text{color:#3f4f48;font-style:italic;font-size:.95rem;line-height:1.7;margin-bottom:16px;}
    .testimoni-card .author{display:flex;align-items:center;gap:12px;border-top:1px dashed #dbe5df;padding-top:14px;}
    .testimoni-card .avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--hijau),var(--hijau-tua));color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:1rem;flex-shrink:0;}
    .testimoni-card .author-info strong{display:block;color:var(--hijau-tua);font-size:.92rem;}
    .testimoni-card .author-info span{display:block;color:#7a8b84;font-size:.78rem;}
    .galeri-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;}
    .galeri-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 4px 16px rgba(13,59,46,.07);transition:.3s;border:1px solid #e6ece8;}
    .galeri-card:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(13,59,46,.14);}
    .galeri-thumb{height:180px;background:linear-gradient(135deg,var(--hijau),var(--hijau-tua));display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.5);overflow:hidden;}
    .galeri-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:.4s;}
    .galeri-card:hover .galeri-thumb img{transform:scale(1.06);}
    .galeri-body{padding:16px 20px;}
    .galeri-body h4{color:var(--hijau-tua);margin-bottom:6px;font-size:1rem;}
    .galeri-body p{color:#5a6b64;font-size:.87rem;}
    .galeri-body .date{display:inline-block;margin-top:8px;font-size:.75rem;color:var(--hijau);border-top:1px dashed #dbe5df;padding-top:8px;width:100%;}
    .list-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;}
    .list-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 4px 16px rgba(13,59,46,.07);transition:.3s;border:1px solid #e6ece8;display:flex;flex-direction:column;}
    .list-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(13,59,46,.13);}
    .list-thumb{height:150px;overflow:hidden;background:linear-gradient(135deg,var(--hijau),var(--hijau-tua));}
    .list-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:.4s;}
    .list-card:hover .list-thumb img{transform:scale(1.06);}
    .list-head{background:linear-gradient(135deg,var(--hijau),var(--hijau-tua));color:#fff;padding:14px 22px;display:flex;align-items:center;justify-content:space-between;gap:10px;}
    .list-head h4{font-size:1rem;}
    .list-head .badge{background:var(--emas);color:var(--hijau-tua);font-size:.7rem;padding:3px 10px;border-radius:20px;font-weight:600;white-space:nowrap;}
    .list-body{padding:18px 22px;flex-grow:1;display:flex;flex-direction:column;}
    .list-body p{color:#4b5b54;font-size:.9rem;margin-bottom:12px;flex-grow:1;}
    .list-meta{display:flex;gap:14px;font-size:.8rem;color:var(--hijau);border-top:1px dashed #dbe5df;padding-top:12px;flex-wrap:wrap;}
    .list-meta span{display:flex;align-items:center;gap:5px;}
    .empty-info{text-align:center;color:#8a9a93;font-style:italic;padding:30px;background:#fff;border-radius:12px;border:1px dashed #cdd8d2;}
    footer{background:#0f2f24;color:#c9dcd3;padding:0;margin-top:40px;position:relative;}
    footer::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--hijau-muda),var(--emas),var(--hijau-muda));}
    .footer-inner{max-width:1200px;margin:0 auto;padding:48px 22px 36px;display:grid;grid-template-columns:1.3fr 1fr 1.5fr;gap:32px;}
    .footer-col h4{color:#fff;font-size:1.05rem;margin-bottom:16px;font-weight:600;letter-spacing:.3px;}
    .footer-col .label-hijau{display:inline-block;background:rgba(201,162,39,.18);color:var(--emas-muda);font-size:.68rem;font-weight:700;letter-spacing:1.2px;padding:4px 10px;border-radius:20px;margin-bottom:12px;text-transform:uppercase;}
    .footer-col p{font-size:.87rem;line-height:1.7;color:#b8d4c8;margin-bottom:12px;}
    .footer-col .kontak-item{display:flex;align-items:flex-start;gap:10px;font-size:.85rem;color:#b8d4c8;margin-bottom:10px;line-height:1.6;}
    .footer-col .kontak-item .ico{color:var(--emas-muda);flex-shrink:0;margin-top:3px;}
    .footer-col .sosial{display:flex;gap:10px;margin-top:18px;}
    .footer-col .sosial a{width:38px;height:38px;background:rgba(255,255,255,.08);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#c9dcd3;text-decoration:none;transition:.25s;}
    .footer-col .sosial a:hover{background:var(--emas);color:var(--hijau-tua);transform:translateY(-2px);}
    .footer-nav{list-style:none;padding:0;}
    .footer-nav li{margin-bottom:2px;}
    .footer-nav a{display:block;color:#b8d4c8;text-decoration:none;font-size:.88rem;padding:6px 0;transition:.2s;}
    .footer-nav a:hover{color:var(--emas-muda);padding-left:6px;}
    .footer-jam{font-size:.85rem;color:#b8d4c8;line-height:1.8;margin-bottom:10px;}
    .footer-jam .baris{display:flex;justify-content:space-between;gap:10px;}
    .footer-map{border-radius:12px;overflow:hidden;background:#1a3d30;min-height:220px;position:relative;}
    .footer-map iframe{width:100%;height:100%;min-height:220px;border:0;display:block;}
    .footer-bawah{border-top:1px solid rgba(255,255,255,.08);padding:18px 22px;max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:.82rem;color:#8fada0;}
    .footer-bawah a{color:#b8d4c8;text-decoration:none;font-weight:600;transition:.2s;}
    .footer-bawah a:hover{color:var(--emas-muda);}
    .wa-float{position:fixed;bottom:24px;right:24px;background:#25D366;color:#fff;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 22px rgba(37,211,102,.4);text-decoration:none;z-index:999;transition:.3s;}
    .wa-float:hover{transform:scale(1.1);box-shadow:0 10px 28px rgba(37,211,102,.5);}
    .wa-float svg{width:30px;height:30px;}
    @media(max-width:1024px){
        .tiga-card{grid-template-columns:1fr 1fr;}
        .card-wakaf{grid-column:1 / -1;}
        .card-wakaf .wakaf-gambar{width:36%;}
    }
    @media(max-width:900px){
        .footer-inner{grid-template-columns:1fr 1fr;}
        .footer-col.map{grid-column:1 / -1;}
    }
    @media(max-width:820px){
        .brand .logo{width:44px;height:44px;}
        .brand .brand-text h1{font-size:1rem;}
        .hero-masjid{min-height:300px;padding:50px 20px;}
        .hero-masjid h1{font-size:1.6rem;}
        .hero-masjid .bismillah{font-size:1.1rem;}
        .sholat-strip{top:70px;}
        .sholat-strip-inner{flex-direction:column;}
        .sholat-panel{width:100%;justify-content:center;padding:12px 18px;}
        .sholat-panel .panel-shalat{font-size:1rem;}
        .sholat-panel .panel-jam{font-size:1.3rem;}
        .sholat-marquee-track{font-size:.82rem;gap:22px;padding:10px 16px;}
        .kontak-grid{grid-template-columns:1fr;}
    }
    @media(max-width:640px){
        .tiga-card{grid-template-columns:1fr;}
        .card-wakaf{flex-direction:column;}
        .card-wakaf .wakaf-gambar{width:100%;height:160px;}
        .card-iqamah .countdown{font-size:2rem;}
        .footer-inner{grid-template-columns:1fr;padding:36px 20px 28px;}
        .footer-bawah{flex-direction:column;text-align:center;}
    }
    @media(max-width:480px){
        .sholat-panel{padding:10px 14px;gap:12px;}
        .sholat-panel .panel-icon{width:36px;height:36px;}
        .sholat-panel .panel-shalat{font-size:.95rem;}
        .sholat-panel .panel-jam{font-size:1.15rem;}
        .sholat-panel .panel-countdown{font-size:.7rem;padding:2px 8px;}
        .sholat-marquee-track{font-size:.75rem;gap:18px;padding:9px 12px;}
        section{padding:40px 16px;}
        .section-title h3{font-size:1.3rem;}
    }

:where(img[height]){height:auto}
/* ===== Form minat (komponen bersama, rapi di semua lebar layar) ===== */
.lead{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);align-items:start}
.lead-kicker{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--f-accent,var(--p));margin-bottom:.7em}
.lead-intro h3{margin:0 0 .5em;font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.18}
.lead-intro p{margin:0 0 1.2em;color:var(--f-muted,var(--muted))}
.lead-points{list-style:none;margin:0;padding:0;display:grid;gap:.7em}
.lead-points li{display:flex;gap:.65em;align-items:flex-start;font-weight:600;line-height:1.4}
.lead-points .ic{color:var(--f-accent,var(--p));margin-top:.15em}
.lead-form{background:var(--f-bg,#fff);color:var(--f-ink,var(--ink));border:var(--f-border,1px solid var(--line));border-radius:var(--f-radius,20px);padding:clamp(20px,3vw,34px);box-shadow:var(--f-shadow,0 24px 50px -36px rgba(0,0,0,.35));min-width:0}
.lf-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 18px;align-items:start}
.fld{min-width:0;display:flex;flex-direction:column}
.fld.full{grid-column:1/-1}
.fld label{font-weight:700;font-size:.86rem;margin-bottom:7px;display:flex;align-items:baseline;gap:.35em}
.fld label i{font-style:normal;color:var(--f-err,#d92d20)}
.fld label small{font-weight:500;color:var(--f-muted,var(--muted));font-size:.78rem}
.inp{position:relative;display:flex;align-items:center}
.inp .ic{position:absolute;left:14px;width:18px;height:18px;color:var(--f-muted,var(--muted));pointer-events:none}
.inp input,.inp textarea{width:100%;font:inherit;font-size:.96rem;color:inherit;background:var(--f-field,transparent);border:1.5px solid var(--f-line,var(--line));border-radius:calc(var(--f-radius,20px) * .55);padding:.82em 1em .82em 2.65em;transition:border-color .15s,box-shadow .15s;min-width:0}
.inp.ta{align-items:stretch}
.inp textarea{padding:.85em 1em;resize:vertical;min-height:112px;line-height:1.5}
.inp input::placeholder,.inp textarea::placeholder{color:color-mix(in srgb,currentColor 38%,transparent)}
.inp input:focus,.inp textarea:focus{outline:none;border-color:var(--f-accent,var(--p));box-shadow:0 0 0 4px color-mix(in srgb,var(--f-accent,var(--p)) 18%,transparent)}
.fld.err .inp input{border-color:var(--f-err,#d92d20)}
.fld .msg{margin:5px 0 0;font-size:.78rem;line-height:1.3;color:var(--f-err,#d92d20);min-height:0;display:none}
.fld.err .msg{display:block}
.lf-submit{margin-top:20px;width:100%;display:flex;align-items:center;justify-content:center;gap:.6em;border:0;cursor:pointer;font:inherit;font-weight:800;font-size:1rem;padding:1em 1.4em;border-radius:calc(var(--f-radius,20px) * .6);background:var(--f-btn-bg,var(--p));color:var(--f-btn-ink,#fff);transition:transform .15s,filter .15s}
.lf-submit:hover{transform:translateY(-2px);filter:brightness(1.06)}
.lf-submit[disabled]{opacity:.6;cursor:wait;transform:none}
.form-status{margin:14px 0 0;font-weight:600;font-size:.92rem;min-height:0;display:none;padding:.75em 1em;border-radius:12px}
.form-status.ok,.form-status.bad{display:block}
.form-status.ok{color:#067647;background:#ecfdf3}
.form-status.bad{color:#b42318;background:#fef3f2}
.form-note{display:flex;gap:.5em;align-items:flex-start;font-size:.78rem;color:var(--f-muted,var(--muted));margin:14px 0 0;line-height:1.4}
.form-note .ic{width:15px;height:15px;flex:none;margin-top:.1em}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width:980px){.lead{grid-template-columns:minmax(0,1fr)}}
@media (max-width:620px){.lf-grid{grid-template-columns:minmax(0,1fr);gap:14px}.lead-form{padding:20px 16px}}

/* ===== Lisensi & perlindungan salin ===== */
body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea,select,[contenteditable="true"],.cinfo,.cinfo *{-webkit-user-select:text;user-select:text}
img,svg{-webkit-user-drag:none;user-drag:none}
@media print{html{display:none!important}}

/* ===== Virtual tour ===== */
.tour{position:relative;overflow:hidden;background:var(--tour-bg,#dfe6ea)}
.tour-fallback{width:100%;height:100%;object-fit:cover;display:block}
#tourView{position:absolute;inset:0;display:none}
.tour.tour-on #tourView{display:block}.tour.tour-on .tour-fallback{display:none}
.tour-badge,.tour-hint{position:absolute;z-index:5;display:none;align-items:center;gap:.45em;background:rgba(10,12,18,.66);color:#fff;font:700 .78rem/1 system-ui,sans-serif;padding:.55em .95em;border-radius:99px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);pointer-events:none}
.tour-badge .ic{width:14px;height:14px}
.tour-badge{right:14px;top:14px}.tour-hint{left:50%;bottom:14px;transform:translateX(-50%);transition:opacity .6s;font-weight:600}
.tour.tour-on .tour-badge,.tour.tour-on .tour-hint{display:inline-flex}.tour.touched .tour-hint{opacity:0}

/* ===== Foto: bila file belum ada, elemen disembunyikan oleh onerror ===== */
img{max-width:100%}
.ic{width:1.25em;height:1.25em;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none;display:inline-block;vertical-align:middle}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s,transform .7s}
.reveal.in{opacity:1;transform:none}
.hide-sm{}
.skip{position:absolute;left:-999px;top:8px;background:#fff;color:#000;padding:8px 14px;border-radius:8px;z-index:300}.skip:focus{left:8px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}

/* ===== Form minat, lisensi & perlindungan (format bersama seluruh website) ===== */
:root{--p:var(--hijau);--pd:var(--hijau-tua);--ink:var(--teks);--muted:#5d6f68;--line:#dbe5df;
 --f-radius:14px;--f-bg:#fff;--f-border:1px solid #dbe5df;--f-shadow:0 6px 20px rgba(13,59,46,.08);--f-accent:var(--hijau);--f-line:#cfdcd5;--f-btn-bg:linear-gradient(135deg,var(--hijau),var(--hijau-tua));--f-muted:#5d6f68}
.lead{background:var(--krem);border-radius:18px;padding:clamp(20px,4vw,40px)}
.lead-kicker{color:var(--emas)}.lead-intro h3{color:var(--hijau-tua)}
.lf-submit{border-radius:30px}
.cinfo,.kontak-grid{-webkit-user-select:text;user-select:text}

/* ===== Form minat di bawah footer + keterangan lisensi ===== */
.lead-band{padding:clamp(44px,6vw,80px) clamp(16px,4vw,32px) clamp(110px,12vw,130px);border-top:1px solid #dbe5df}
.lead-band-in{width:min(1100px,100%);margin-inline:auto}
.lead-band .lead{margin:0}
.license{width:min(760px,100%);margin:clamp(30px,4vw,44px) auto 0;padding:clamp(22px,3vw,30px) clamp(20px,4vw,40px);text-align:center;font-size:.88rem;line-height:1.75;color:var(--f-muted,var(--muted));border:1px solid #dbe5df;border-radius:16px;background:color-mix(in srgb,currentColor 4%,transparent);box-sizing:border-box}
.license .lic-t{display:flex;justify-content:center;align-items:center;gap:.55em;margin:0 0 .75em;color:var(--f-ink,var(--ink));font-size:.78rem;letter-spacing:.14em;text-transform:uppercase}
.license .lic-t b{font-weight:800}.license .lic-t .ic{width:16px;height:16px}
.license p{margin:0 auto 1.1em;max-width:58ch;text-wrap:balance}
.license a{color:var(--f-accent,var(--p));font-weight:700;text-decoration:underline;text-underline-offset:3px}
.license .lic-wa{display:inline-flex;align-items:center;justify-content:center;gap:.55em;max-width:100%;text-decoration:none;font-weight:800;font-size:.86rem;line-height:1.2;padding:.7em 1.3em;border:1.5px solid #dbe5df;border-radius:99px;color:var(--f-ink,var(--ink));white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
.license .lic-wa .ic{width:17px;height:17px;flex:none}
.license .lic-wa:hover{background:var(--f-accent,var(--p));color:#fff;border-color:transparent}
@media (max-width:420px){.license{font-size:.84rem;padding:22px 18px}.license .lic-wa{font-size:.78rem;padding:.65em 1em;gap:.45em}}
.lead-band{background:var(--bg)}
@media (max-width:720px){.lead-band{padding-bottom:180px}}