
*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif}
body{background:#f5f7fa;color:#333;line-height:1.6}
header{background:linear-gradient(120deg,#0f2027,#203a43,#2c5364);color:#fff;padding:40px;text-align:center}
nav a{color:#fff;margin:0 15px;text-decoration:none;font-weight:bold}
nav a:hover{color:#00eaff}
section{padding:60px 10%;animation:fadeIn 1.2s ease}
h2{margin-bottom:20px;color:#2c5364}
.card{background:#fff;border-radius:12px;padding:25px;box-shadow:0 10px 25px rgba(0,0,0,.1);margin-bottom:25px;transition:transform .3s}
.card:hover{transform:translateY(-8px)}
img.hero{max-width:100%;border-radius:16px;box-shadow:0 10px 25px rgba(0,0,0,.2)}
footer{background:#203a43;color:#fff;text-align:center;padding:20px}
@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}


/* ===== CPIG Premium Theme ===== */
:root{
  --primary:#0b2a4a;
  --secondary:#123d6a;
  --accent:#1fa2ff;
  --bg:#f5f7fb;
  --text:#0f172a;
}
body{background:var(--bg); color:var(--text); font-family: 'Segoe UI', Arial, sans-serif;}
header, nav{background:linear-gradient(135deg,var(--primary),var(--secondary)); color:#fff;}
a{color:var(--accent);}
.hero{
  background:linear-gradient(rgba(11,42,74,.75),rgba(11,42,74,.75)), url('images/banner.jpg') center/cover no-repeat;
  color:#fff; padding:90px 20px; text-align:center;
}
.hero h1{font-size:42px; margin-bottom:10px;}
.hero p{font-size:18px; opacity:.95;}
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; padding:40px;}
.card{background:#fff; border-radius:16px; box-shadow:0 10px 25px rgba(0,0,0,.08); padding:20px;}
.card img{max-width:100%; border-radius:12px;}
footer{background:var(--primary); color:#cbd5e1; padding:20px; text-align:center;}


.whatsapp-float{
 position:fixed;
 bottom:20px;
 left:50%;
 transform:translateX(-50%);
 width:60px;
 height:60px;
 background:#25D366;
 border-radius:50%;
 display:flex;
 align-items:center;
 justify-content:center;
 box-shadow:0 4px 10px rgba(0,0,0,.3);
 animation:pulse 2s infinite;
 z-index:9999;
}
.whatsapp-float img{
 width:35px;
 height:35px;
}
@keyframes pulse{
 0%{transform:translateX(-50%) scale(1);}
 50%{transform:translateX(-50%) scale(1.1);}
 100%{transform:translateX(-50%) scale(1);}
}
