/* SILIR MODERN - OpenSID 2607 */
:root{--sm-bg:#111827;--sm-card:#303b50;--sm-card2:#263247;--sm-teal:#0796b5;--sm-green:#10b981;--sm-line:#46536a;--sm-text:#edf2f7}
html{scroll-behavior:smooth}body{background:var(--sm-bg)!important;color:var(--sm-text)!important;font-family:Poppins,system-ui,sans-serif}
body .container{max-width:1240px}
header{min-height:560px;border-radius:0 0 20px 20px;overflow:hidden;background-position:center;background-size:cover;display:flex;flex-direction:column;justify-content:center}
header .text-h2{font-size:clamp(1.5rem,4vw,2.5rem);font-weight:800;text-transform:uppercase;text-shadow:0 3px 14px #000}
header section p{font-size:1.1rem;color:#e2e8f0}
header .absolute.bg-gray-800{background:linear-gradient(180deg,rgba(10,20,35,.42),rgba(10,20,35,.78))!important}
header img{max-height:116px;object-fit:contain}
.bg-primary-100{background-color:var(--sm-teal)!important}.bg-primary-200{background-color:#087d98!important}
nav.bg-primary-100{box-shadow:0 8px 25px #0003}
main,.bg-white,.rounded-lg.shadow{background:var(--sm-card)!important;color:var(--sm-text)!important;border:1px solid var(--sm-line)}
main a,.content a{color:#42c7e6}main p,main li{color:#e5eaf2}
.text-gray-600,.text-gray-700,.text-gray-800{color:#e5eaf2!important}
.bg-zinc-700{background:#202b3e!important}
article h1,.text-h2,.text-h3,.text-h4{color:#f8fafc!important}
input,select,textarea{background:#1c2739!important;color:#f8fafc!important;border-color:#536179!important}
.card,.panel,.widget{background:var(--sm-card);border:1px solid var(--sm-line);border-radius:14px}
footer.container{padding-bottom:100px}
.silir-mobile-nav{display:none}
.silir-wa{position:fixed;right:16px;bottom:95px;width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#20c96b;color:#fff!important;font-size:30px;z-index:9998;box-shadow:0 6px 18px #0004}
.silir-top{position:fixed;right:20px;bottom:165px;width:48px;height:48px;border-radius:50%;border:3px solid #fff;background:#d99b09;color:white;z-index:9997;font-size:18px}
@media(max-width:767px){
 body{padding-bottom:72px!important}header{min-height:520px;margin:0!important;border-radius:0 0 14px 14px}header section{padding-top:25px!important}header section .text-h2{font-size:1.45rem;line-height:1.35}header section p{font-size:.95rem}
 body>.container, .container{padding-left:12px;padding-right:12px}
 main{padding:14px!important;border-radius:12px!important}
 .silir-mobile-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;height:68px;background:#303b50;border-top:1px solid #526078;z-index:10000;padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -5px 20px #0003}
 .silir-mobile-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#f1f5f9!important;font-size:11px;text-decoration:none}
 .silir-mobile-nav a i{font-size:20px}.silir-mobile-nav a.active{background:#086d83}
 .silir-wa{bottom:86px;right:14px;width:54px;height:54px}.silir-top{bottom:150px;right:18px}
 footer.container{padding-bottom:18px}
}

/* Menu layanan kotak seperti referensi Silir */
.silir-service-grid-wrap{position:relative;z-index:5;width:100%;max-width:980px;margin:42px auto 28px;padding:0 22px}
.silir-service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:22px 26px}
.silir-service-card{height:180px;min-height:180px;box-sizing:border-box;padding:18px 12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center;text-decoration:none!important;color:#f1f5f9!important;background:#303b50;border:2px solid #59667c;border-radius:15px;box-shadow:0 7px 18px rgba(0,0,0,.22);font-size:clamp(15px,2vw,20px);font-weight:500;line-height:1.35;transition:transform .2s ease,background .2s ease,border-color .2s ease}
.silir-service-card:hover{background:#394861;border-color:#0796b5;transform:translateY(-3px)}
.silir-service-card>span:last-child{min-height:2.7em;display:flex;align-items:center;justify-content:center;max-width:100%;overflow-wrap:normal;word-break:normal}.silir-service-icon{display:block;font-size:48px;line-height:1.1;min-height:54px;flex:0 0 54px}
@media(max-width:767px){
 header{min-height:0!important;display:block!important;padding-bottom:12px}
 header section{margin-top:0!important;padding-top:70px!important;padding-bottom:8px!important}
 .silir-service-grid-wrap{margin:48px auto 22px;padding:0 10px}
 .silir-service-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:164px;gap:16px 12px}
 .silir-service-card{height:164px;min-height:164px;padding:14px 7px;gap:12px;border-radius:14px;font-size:15px;overflow-wrap:normal}
 .silir-service-icon{font-size:44px;min-height:49px}
}
@media(max-width:360px){.silir-service-grid{grid-auto-rows:150px;gap:12px 8px}.silir-service-card{height:150px;min-height:150px;font-size:13px}.silir-service-icon{font-size:38px}}

/* Nama desa: ruang lebih terukur dan efek mesin tik berulang */
.silir-name-wrap{width:min(92%,680px);margin:0 auto;padding:0 8px;overflow:hidden;text-align:center}
header .silir-village-name{display:inline-block;width:0;max-width:100%;overflow:hidden;white-space:nowrap;vertical-align:bottom;border-right:3px solid #fff;padding-right:3px;animation:silir-typewriter 5.5s steps(var(--typing-steps,20),end) infinite alternate;}
@keyframes silir-typewriter{from{width:0}to{width:100%}}
@media(prefers-reduced-motion:reduce){header .silir-village-name{width:auto;animation:none;border-right:0}}