/* Reset + base */
* { box-sizing: border-box; margin: 0; padding: 0; }
html,body { height: 100%; }
body {
  font-family: "Poppins", sans-serif;
  color: #1f2937;
  background: #fafafa;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.5;
}

/* layout helpers */
.container {
  width: 92%;
  max-width: 1200px;
  margin: 0 auto;
}

/* HEADER */
.site-header { background: #fff; border-bottom: 1px solid #eee; position: sticky; top: 0; z-index: 30; }
.header-inner {
  display: flex; align-items: center; gap: 16px; padding: 18px 0;
}
.brand { font-weight: 700; font-size: 20px; color: #0f172a; }
.main-nav { margin-left: auto; display:flex; gap:18px; align-items:center; }
.main-nav a { color:#334155; text-decoration:none; font-weight:500; font-size:15px; padding:6px 8px; }
.btn.small { margin-left:14px; background:#2563eb; color:#fff; padding:8px 12px; border-radius:8px; text-decoration:none; font-weight:600; }

/* HERO */
.hero { padding: 56px 0; background: #fff; }
.hero-grid {
  display: grid;
  grid-template-columns: 1fr 520px;
  align-items: center;
  gap: 36px;
}
.hero-text h1 {
  font-size: 42px;
  line-height: 1.03;
  color: #0b1220;
  margin-bottom:16px;
}
.hero-text .lead { color:#475569; max-width: 560px; margin-bottom:20px; font-size:16px; }
.btn { background:#2563eb; color:#fff; display:inline-block; padding:12px 18px; border-radius:8px; text-decoration:none; font-weight:600; }
.hero-media img { width:100%; height:auto; border-radius:12px; display:block; }

/* accent */
.accent { color:#2563eb; font-weight:700; }

/* ABOUT */
.about { background:#f8fafc; padding:48px 0; border-top:1px solid #eee; border-bottom:1px solid #eee; }
.section-title { font-size:24px; text-align:center; margin-bottom:18px; color:#0b1220; font-weight:700; }
.about-lead { color:#475569; text-align:center; max-width:900px; margin:0 auto 28px; }
.feature-row {
  display:grid;
  grid-template-columns: repeat(4,1fr);
  gap:18px;
  margin-top:16px;
}
.feature { background:#fff; padding:20px; border-radius:10px; text-align:center; box-shadow:0 6px 18px rgba(15,23,42,0.04); }
.feature-icon { font-size:28px; margin-bottom:12px; }

/* SERVICES */
.services { padding:56px 0; background:#fff; }
.centered { text-align:center; }
.services-grid {
  margin-top:28px;
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap:20px;
}
.service-card {
  background:#fff; padding:22px; border-radius:12px; box-shadow:0 10px 30px rgba(2,6,23,0.04);
  display:flex; flex-direction:column; gap:12px;
}
.service-icon { font-size:26px; }
.service-card h3 { font-size:18px; margin-top:4px; color:#0b1220; }
.service-card p { color:#475569; font-size:14px; flex:1; }
.learn { color:#2563eb; font-weight:600; text-decoration:none; }

/* CONTACT */
.contact { padding:44px 0; background:#f8fafc; }
.contact-inner { text-align:center; }
.contact-row { display:flex; gap:20px; justify-content:center; flex-wrap:wrap; margin-top:18px; }
.contact-item { background:#fff; padding:12px 20px; border-radius:10px; box-shadow:0 6px 18px rgba(2,6,23,0.03); color:#0b1220; }

/* FOOTER */
.site-footer { padding:18px 0; background:#0b1220; color:#fff; text-align:center; }

/* Responsive */
@media (max-width: 1000px) {
  .hero-grid { grid-template-columns: 1fr; gap:28px; }
  .hero-text h1 { font-size:32px; }
  .feature-row { grid-template-columns: repeat(2,1fr); }
  .services-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 600px) {
  .main-nav { display:none; }
  .hero-text h1 { font-size:26px; }
  .feature-row { grid-template-columns: 1fr; }
  .services-grid { grid-template-columns: 1fr; }
  .header-inner { padding:12px 0; }
  .btn.small { display:none; }
}
