:root{--primary:#0f4c81;--accent:#f9b233;--bg:#f4f7fb;--text:#1f2937}
*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;background:var(--bg);color:var(--text)}
.container{max-width:1100px;margin:auto;padding:0 16px}.topbar{background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.08);position:sticky;top:0;z-index:10}
.nav{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px}.nav nav{display:flex;flex-wrap:wrap;gap:8px}
.nav a{text-decoration:none;color:var(--primary);padding:4px 8px;border-radius:8px}.nav a:hover{background:#e8eef7}.announce{background:var(--primary);color:#fff;padding:8px 16px}
.hero{background:linear-gradient(135deg,var(--primary),#2563eb);color:#fff;padding:60px 24px;border-radius:16px;margin:20px 0;animation:slide .6s ease}
.btn{display:inline-block;background:var(--accent);color:#111;padding:10px 14px;border-radius:8px;text-decoration:none;border:none;cursor:pointer}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.cards article{background:#fff;padding:16px;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.form{display:grid;gap:10px;max-width:500px}.form input,.form textarea,select{padding:10px;border:1px solid #ccc;border-radius:8px}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.gallery-grid img{width:100%;height:160px;object-fit:cover;border-radius:10px;cursor:pointer}
.footer{background:#111827;color:#fff;margin-top:30px;padding:20px 0}.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:15px}
.whatsapp{position:fixed;bottom:20px;right:20px;background:#22c55e;color:#fff;padding:10px;border-radius:999px;text-decoration:none}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.65);display:flex;align-items:center;justify-content:center}.hidden{display:none}
.modal-content{background:#fff;padding:20px;border-radius:10px;max-width:360px}
#lightbox img{max-width:90vw;max-height:90vh}
.fade-in{animation:fade .6s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}@keyframes slide{from{transform:translateY(12px);opacity:0}to{opacity:1;transform:none}}
@media (max-width:768px){.nav{flex-direction:column;align-items:flex-start}.hero{padding:40px 20px}}