
*{margin:0;padding:0;box-sizing:border-box;font-family:system-ui,-apple-system,sans-serif}
body{background:#f4f6f8;color:#222;line-height:1.4}

/* Links */
a,a:visited,a:hover,a:active{text-decoration:none;color:inherit}

/* Header */
header{position:relative;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#0a9d8f;color:#fff}
header h1{font-size:18px;font-weight:600;color:#fff;padding:4px 8px;border-radius:4px}
.menu{font-size:24px;cursor:pointer}

/* Dropdown */
.dropdown{
  position:absolute;top:55px;left:12px;background:#fff;min-width:180px;border-radius:12px;box-shadow:0 10px 25px rgba(0,0,0,.2);
  display:none;flex-direction:column;overflow:hidden;z-index:999;animation:drop .25s ease
}
@keyframes drop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
.dropdown a{padding:12px 14px;color:#222;display:flex;align-items:center;gap:10px;text-decoration:none;font-size:14px}
.dropdown a:hover{background:#007bff;color:#fff;border-radius:5px}
.dropdown a.active{background:#007bff;color:#fff}

/* Menu icons */
.menu-icon{width:24px;height:24px;object-fit:contain}

/* Banner */
.banner img{width:100%;display:block;border-radius:10px;margin-bottom:12px}

/* Section Title */
.section-title{padding:12px 14px;font-weight:600;font-size:16px;margin-top:10px}

/* Grid layout */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:12px}
@media(max-width:1024px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:768px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.grid{grid-template-columns:1fr}}

/* Cards */
.card{background:#fff;border-radius:14px;padding:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 4px 10px rgba(0,0,0,.08);transition:.2s;width:100%}
.card:hover{transform:translateY(-2px)}
.card img{width:40px;height:40px;margin-bottom:6px}
.card h3{margin:6px 0;font-size:16px;color:#007bff;text-align:center}
.card p{font-size:13px;margin:4px 0;text-align:center}
.call{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:10px}
.call a{background:#28a745;color:#fff;padding:6px 12px;border-radius:20px;text-decoration:none;font-size:13px}
.empty{text-align:center;background:#fff;padding:30px;border-radius:10px;margin-top:20px}

/* Search Box */
.search-box{background:#fff;padding:12px;border-radius:8px;margin-bottom:15px;display:flex;flex-wrap:wrap;gap:8px}
.search-box input{flex:1;min-width:120px;padding:8px;border-radius:5px;border:1px solid #ccc}
.search-box button{padding:8px 15px;border:none;border-radius:5px;background:#007bff;color:#fff;cursor:pointer;font-size:14px}

/* Footer / Bottom nav */
.bottom-nav{position:fixed;bottom:0;left:0;width:100%;display:flex;background:#fff;box-shadow:0 -1px 5px rgba(0,0,0,.1);z-index:999}
.bottom-nav a{flex:1;text-align:center;padding:10px 0;font-size:13px;color:#555}
.bottom-nav a.active{color:#0a9d8f;font-weight:600}
