:root{
  --gold: #d4af37;
  --navy: #0b1f2b;
  --white: #ffffff;
  --muted: #6b7280;
  --container: 1100px;
}

*{box-sizing:border-box}
body{font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; margin:0; color:#0b1f2b; background:#ffffff; line-height:1.5}
.container{max-width:var(--container); margin:0 auto; padding:1.5rem}

.site-header{background:#ffffff; border-bottom:1px solid #e6eef3; position:sticky; top:0; z-index:50}
.header-inner{display:flex; align-items:center; justify-content:space-between}
.brand{display:flex; align-items:center; gap:1rem}
.logo{width:72px; height:72px; object-fit:contain; border-radius:50%;}
.brand-text h1{margin:0; font-size:1.25rem; color:var(--navy); letter-spacing:0.3px}
.tagline{margin:0; font-weight:600; color:var(--navy);}
.subtag{margin:0; color:var(--muted); font-size:0.9rem}

.nav a{margin-left:1rem; text-decoration:none; color:var(--navy); font-weight:600}

.hero{display:flex; gap:2rem; align-items:center; padding:3rem 0}
.hero-content{flex:1}
.hero h2{font-size:2rem; margin:0 0 0.5rem 0; color:var(--navy)}
.hero p{color:var(--muted); margin:0 0 1rem}
.hero-cta .btn{display:inline-block; margin-right:0.5rem}
.hero-image{flex:1; text-align:center}
.hero-image img{max-width:360px; width:100%; height:auto}

.btn{padding:0.65rem 1rem; border-radius:8px; text-decoration:none; display:inline-block}
.btn.primary{background:var(--navy); color:var(--white); font-weight:600}
.btn.outline{border:2px solid var(--navy); color:var(--navy)}

.section{padding:2rem 0}
.section h3{margin:0 0 0.5rem 0; color:var(--navy)}
.muted{color:var(--muted)}

.two-col{display:grid; grid-template-columns:1fr 1fr; gap:1.5rem}

.grid{display:grid; gap:1rem}
.grid-5{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));}
.card{background:#fff; border:1px solid #eef3f6; padding:1rem; border-radius:8px; text-align:center}
.card img{width:100%; height:120px; object-fit:cover; border-radius:6px}
.card h4{margin-top:0.75rem; color:var(--navy)}

.contact-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem}
.contact-card{background:#fff; border:1px solid #eef3f6; padding:1rem; border-radius:8px}
.contact-card a{color:var(--navy); text-decoration:none; font-weight:600}

.site-footer{background:#f8fafc; padding:1rem 0; border-top:1px solid #e6eef3}

/* Responsive */
@media (max-width:900px){
  .hero{flex-direction:column-reverse}
  .header-inner{flex-direction:column; align-items:flex-start; gap:0.75rem}
  .brand-text h1{font-size:1rem}
  .two-col{grid-template-columns:1fr}
}