/* smartpsu.com — minimal light theme */
:root{
  --bg:#ffffff;
  --fg:#0f172a; /* slate-900 */
  --muted:#475569; /* slate-600 */
  --accent:#2563eb; /* blue-600 */
  --accent-2:#0ea5e9; /* sky-500 */
  --ring:#93c5fd; /* blue-300 */
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Inter,Arial,sans-serif;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.container{
  max-width:960px;
  margin:0 auto;
  padding:24px;
}
.header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding-top:12px;
  padding-bottom:12px;
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:inherit;
}
.brand img{height:36px;width:auto}
.brand .name{font-weight:700;letter-spacing:.2px}
.hero{
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:64px 0 40px;
}
h1{
  font-size:clamp(28px, 4vw, 44px);
  margin:0;
  letter-spacing:-.02em;
}
p.lead{
  font-size:clamp(16px, 2.2vw, 20px);
  color:var(--muted);
  margin:0;
}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.badge{
  border:1px solid #e5e7eb;
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  color:#334155;
  background:#f8fafc;
}
.cta{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:24px;
}
.button{
  appearance:none;
  border:1px solid var(--accent);
  background:var(--accent);
  color:white;
  padding:12px 16px;
  border-radius:10px;
  font-weight:600;
  text-decoration:none;
  transition:transform .04s ease, box-shadow .2s ease, background .2s ease;
  box-shadow:0 6px 18px rgba(37,99,235,.18);
}
.button:hover{transform:translateY(-1px);background:#1d4ed8}
.button.secondary{
  background:transparent;
  color:var(--accent);
  box-shadow:none;
}
.hr{height:1px;background:#e5e7eb;margin:40px 0}
.features{
  display:grid;
  gap:16px;
  grid-template-columns:repeat(12,1fr);
}
.card{
  grid-column:span 12;
  border:1px solid #e5e7eb;
  border-radius:14px;
  padding:18px;
  background:#fff;
}
@media(min-width:700px){
  .card{grid-column:span 6}
}
.card h3{margin:0 0 6px 0;font-size:18px}
.card p{margin:0;color:#475569}
.footer{
  display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;
  padding:24px 0 40px;color:#64748b;font-size:14px;
}
.footer a{color:#334155}
.subscribe{
  display:flex;gap:8px;flex-wrap:wrap
}
input[type="email"]{
  border:1px solid #e5e7eb;border-radius:10px;padding:10px 12px;min-width:260px;
  outline:none;
}
input[type="email"]:focus{border-color:var(--ring); box-shadow:0 0 0 4px rgba(147,197,253,.35)}
.note{font-size:12px;color:#64748b}