:root{
  --navy: #0A2A43;
  --steel: #4A5568;
  --azure: #3A8DDF;
  --soft-silver: #E5E8EB;
  --white: #ffffff;
  --max-width: 1100px;
  --radius: 10px;
  --container-padding: 20px;
  --shadow: 0 6px 20px rgba(10,42,67,0.08);
}
*{box-sizing:border-box}
html,body{height:100%}
body{font-family:'Lato',system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial;line-height:1.5;color:var(--steel);margin:0;background:var(--white)}
.container{max-width:var(--max-width);margin:0 auto;padding:var(--container-padding)}

/* Header */
.site-header{border-bottom:1px solid var(--soft-silver);background:linear-gradient(180deg, #ffffff, #fbfdff)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.brand{font-family:'Montserrat',sans-serif;font-weight:700;color:var(--navy);text-decoration:none;font-size:1.4rem}
.nav{display:flex;gap:18px;align-items:center}
.nav a{color:var(--steel);text-decoration:none;padding:6px 8px;border-radius:6px}
.nav a:hover{color:var(--navy)}
.btn-outline{border:1px solid var(--soft-silver);padding:8px 12px;border-radius:8px}

/* Mobile Nav */
.nav-toggle{display:none;background:none;border:0;font-size:1.2rem}
@media(max-width:800px){.nav{display:none}.nav-toggle{display:block}}

/* Hero */
.hero{padding:48px 0;display:flex;align-items:center}
.hero-inner{display:flex;gap:40px;align-items:center}
.hero-copy{flex:1}
.hero-copy h1{font-family:'Montserrat',sans-serif;color:var(--navy);font-size:2.1rem;margin:0 0 12px}
.lead{color:var(--steel);margin:0 0 20px}
.hero-ctas{display:flex;gap:12px}
.btn{background:var(--navy);color:var(--white);padding:12px 18px;border-radius:8px;text-decoration:none;font-weight:600}
.btn-secondary{background:transparent;border:2px solid var(--azure);color:var(--navy);padding:10px 16px;border-radius:8px;text-decoration:none}
.logo-card{border-radius:12px;padding:20px;box-shadow:var(--shadow);background:linear-gradient(180deg,var(--white),#f7fbff);width:320px;text-align:center}
.logo-text{font-family:'Montserrat',sans-serif;font-size:2rem;color:var(--navy);font-weight:700}
.tagline{color:var(--steel);margin-top:6px;margin-bottom:10px}
.swatches{display:flex;justify-content:center;gap:8px;margin-top:10px}
.swatch{width:36px;height:12px;border-radius:4px;display:inline-block;box-shadow:0 2px 6px rgba(0,0,0,0.06)}
.swatch.navy{background:var(--navy)}
.swatch.gray{background:var(--steel)}
.swatch.white{background:#fff;border:1px solid var(--soft-silver)}
.swatch.azure{background:var(--azure)}

/* Sections */
.features,.why,.solutions,.testimonials{padding:40px 0}
.section-lead{color:var(--steel);margin-bottom:18px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}
.card{background:var(--white);padding:18px;border-radius:10px;box-shadow:var(--shadow)}
.card h3{margin-top:0;color:var(--navy)}

.why-inner{display:flex;gap:20px;align-items:center}
.why-copy{flex:1}
.why-list{list-style:disc;margin-left:20px;color:var(--steel)}

.stats-card{background:linear-gradient(180deg,#ffffff,#f3f7fb);padding:16px;border-radius:8px;text-align:center}
.stat{padding:8px}
.stat strong{display:block;font-size:1.4rem;color:var(--navy)}

/* Testimonials */
.testimonials blockquote{background:linear-gradient(180deg,#f8fafc,#ffffff);padding:20px;border-left:4px solid var(--azure);border-radius:8px}
.testimonials cite{display:block;margin-top:8px;color:var(--steel)}

/* Page layouts */
.page-hero{padding:28px 0}
.two-col{display:grid;grid-template-columns:2fr 1fr;gap:24px}
.two-col .card{padding:20px}
.contact-grid{display:grid;grid-template-columns:2fr 1fr;gap:20px;padding:20px 0}

/* Footer */
.site-footer{border-top:1px solid var(--soft-silver);padding:30px 0;margin-top:40px;background:linear-gradient(180deg,#fbfdff,#ffffff)}
.footer-inner{display:flex;gap:20px;justify-content:space-between;align-items:flex-start}
.footer-col h4{margin:0 0 8px;color:var(--navy)}
.footer-nav a{display:block;color:var(--steel);text-decoration:none;margin-bottom:6px}
.site-credit{padding:12px 0;color:var(--steel);font-size:0.9rem}

/* Responsive */
@media(max-width:1000px){.grid-3{grid-template-columns:repeat(2,1fr)}.hero-inner{flex-direction:column}.two-col{grid-template-columns:1fr}}
@media(max-width:700px){.grid-3{grid-template-columns:1fr}.footer-inner{flex-direction:column}.contact-grid{grid-template-columns:1fr}}

.contact-form {
  padding: 25px;
}

.contact-form h2 {
  margin-bottom: 20px;
  text-align: center;
}

.form-group {
  margin-bottom: 18px;
  display: flex;
  flex-direction: column;
}

label span {
  color: #e63946; /* red required indicator */
}

input,
textarea {
  width: 100%;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid #ccc;
  font-size: 1rem;
  transition: border 0.2s;
}

input:focus,
textarea:focus {
  border-color: #4f46e5; /* theme color, can adjust */
  outline: none;
}

.btn {
  width: 100%;
  padding: 12px;
  font-size: 1.1rem;
  border-radius: 8px;
  color: #fff;
  border: none;
  cursor: pointer;
  transition: background 0.2s;
}

.btn:hover {
  background: #14344d;
}

.error-msg {
  color: red;
  font-size: 0.85rem;
  margin-top: 5px;
}