/*
Theme Name: IT Tools Lab
Author: Jeremy
Version: 1.3
*/

:root {
  --bg: #0f1525;
  --text: #e8ecf7;
  --muted: #9fb0d0;
  --primary: #5dd0ff;
  --primary-2: #3aa1cc;
}

body {
  margin: 0;
  font-family: system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
}

.container {
  width: 95%;
  max-width: 1100px;
  margin: 0 auto;
}

/* Hero */
.hero {
  position: relative;
  min-height: 40vh;   /* compact hero */
  padding: 2rem 0;
  text-align: center;
  background: url('https://ittoolslab.com/wp-content/uploads/2025/11/hero-banner.png') center/cover no-repeat;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(10,20,40,0.6);
  z-index: 0;
}
.hero .container { position: relative; z-index: 1; }
.hero h1 { font-size: 2.2rem; margin-bottom: .5rem; }
.hero p { color: var(--muted); margin-bottom: 1rem; }
.hero-ctas { display: flex; gap: .8rem; justify-content: center; flex-wrap: wrap; }

/* Buttons */
.btn {
  display: inline-block;
  padding: .6rem 1rem;
  border-radius: 8px;
  border: 1px solid transparent;
}
.btn-primary {
  background: var(--primary);
  color: #072940;
  font-weight: 700;
}
.btn-primary:hover { background: var(--primary-2); }
.btn-secondary {
  border-color: var(--primary);
  color: var(--primary);
}

/* Features */
.features {
  padding: 2rem 0;
  background: var(--bg);
}
.features-row {
  display: flex;              /* horizontal layout */
  justify-content: center;
  gap: 3rem;
}
.feature {
  text-align: center;
  max-width: 220px;
}
.feature