body{font-family:Poppins,sans-serif;margin:0;background:#fff;color:#222;line-height:1.6}
.container{max-width:1100px;margin:auto;padding:20px}
header{background:#fdfdfd;box-shadow:0 2px 6px rgba(0,0,0,0.05)}
.nav{display:flex;justify-content:space-between;align-items:center}
.logo{height:60px}
nav a{text-decoration:none;margin-left:20px;font-weight:600;color:#333}
nav a.active{color:#009688}
.hero{background:linear-gradient(135deg,#00c9a7,#009688);color:#fff;text-align:center;padding:100px 20px}
.hero h1{font-size:2.4rem}
.hero .btn{background:#fff;color:#009688;padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:600;margin-top:20px;display:inline-block}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
.card{background:#fff;padding:20px;border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,0.05)}
.btn{background:#ff6f61;color:white;padding:10px 20px;border-radius:6px;text-decoration:none}
blockquote{background:#f7fdfa;border-left:5px solid #00c9a7;padding:15px;margin:15px 0}
.dari{font-family:'Noto Naskh Arabic',serif;font-size:1.1rem;color:#444}
footer{background:#f7f7f7;text-align:center;padding:20px;color:#555;margin-top:40px}
.contact-form label{display:block;margin-top:10px;font-weight:600}
.contact-form input,.contact-form textarea{width:100%;padding:10px;margin-top:5px;border:1px solid #ccc;border-radius:6px}