:root{
  --primary:#0b6efd;    /* replace with theme color */
  --accent:#0b6efd;
  --muted:#666;
  --bg:#f9fbff;
  --max-width:1200px;
  --container-padding:1rem;
  --radius:10px;
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color:#111;
  background:var(--bg);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}

.container{
  max-width:var(--max-width);
  margin:0 auto;
  padding:0 var(--container-padding);
}

.site-header{
  background:#fff;
  border-bottom:1px solid #e6ecf3;
  position:sticky;
  top:0;
  z-index:50;
}
.header-inner{
  display:flex;
  gap:1rem;
  align-items:center;
  justify-content:space-between;
  padding:0.8rem 0;
}
.brand{
  font-weight:700;
  font-size:1.15rem;
  color:var(--primary);
  text-decoration:none;
}
.main-nav{
  display:flex;
  gap:1rem;
  align-items:center;
}
.main-nav a{ color:#222; text-decoration:none; padding:0.4rem 0.6rem; border-radius:6px;}
.main-nav a.cta{ background:var(--primary); color:#fff; }
.nav-toggle{ display:none; background:none; border:0; font-size:1.25rem; cursor:pointer;}

.hero{
  padding:3rem 0;
  background:linear-gradient(180deg,#fff 0%, #f6f9ff 100%);
}
.hero-grid{ display:grid; grid-template-columns:1fr 420px; gap:2rem; align-items:center; }
.hero h1{ margin:0 0 .6rem; font-size:2rem; }
.lead{ color:var(--muted); font-size:1.05rem; margin-bottom:1rem; }
.hero-cta .btn{ margin-right:.5rem; }

.btn{
  display:inline-block;
  padding:0.6rem 1rem;
  border-radius:8px;
  text-decoration:none;
  border:1px solid transparent;
}
.btn.primary{ background:var(--primary); color:#fff; }
.btn.outline{ background:transparent; color:var(--primary); border:1px solid #dbe7ff; }
.btn.large{ padding:0.9rem 1.2rem; font-size:1rem; }

.key-facts{
  list-style:none;
  padding:0;
  margin:1rem 0 0;
  display:flex;
  flex-wrap:wrap;
  gap:.5rem 1rem;
}
.key-facts li{
  background:#fff; border:1px solid #eef3ff; padding:.45rem .75rem; border-radius:8px; font-size:.9rem;
}

.section{ padding:2.4rem 0; background:transparent }
.section .section-sub{ color:var(--muted); margin-top:.25rem; margin-bottom:1rem }

.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem; margin-top:1rem;}
.card{ background:#fff; padding:1.1rem; border-radius:10px; border:1px solid #eef3ff; box-shadow:0 6px 18px rgba(20,34,80,0.03)}
.card.highlight{ border-left:4px solid var(--primary); }

.split{ display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:center;}
.service-visual img, .hero-image img{ max-width:100%; display:block; }

.trust-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:1rem; margin-top:1rem;}
.trust-item{ background:#fff; padding:1rem; border-radius:8px; text-align:center; border:1px dashed #e6edf9; color:var(--muted); }

.cta-strip{ background:var(--primary); color:#fff; padding:1.1rem 0; margin-top:1.6rem;}
.cta-inner{ display:flex; justify-content:space-between; align-items:center; gap:1rem; }

.footer-grid{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:1rem; align-items:start; padding:2rem 0; border-top:1px solid #e6ecf3; /*background:#fff;*/ }
.site-footer{ margin-top:2rem;}
.footer-nav a{ display:block; color:#333; text-decoration:none; margin-bottom:.4rem; }

.cards .learn-more{ display:inline-block; margin-top:.6rem; color:var(--primary); text-decoration:none;}

.industry-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(360px,1fr)); gap:1rem; margin-top:1rem;}
.industry{ background:#fff; padding:1rem; border-radius:10px; border:1px solid #eef3ff }

.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:1rem;}
.contact-card{ background:#fff; padding:1rem; border-radius:10px; border:1px solid #eef3ff }

.muted{ color:var(--muted); font-size:.95rem; }

@media (max-width:900px){
  .hero-grid{ grid-template-columns:1fr; }
  .split{ grid-template-columns:1fr; }
  .contact-grid{ grid-template-columns:1fr; }
  .main-nav{ display:none; position:absolute; right:1rem; top:60px; background:#fff; padding:1rem; border-radius:8px; box-shadow:0 8px 30px rgba(20,34,80,0.08);}
  .nav-toggle{ display:block; }
}
input, textarea {
    width: 100%;
    padding: 7px;
    border-radius: 5px;
    margin-bottom: 10px;
}
/* small helpers */
.highlight-alt{ background:linear-gradient(90deg,#fff 0%, #f3fbff 100%);}
.alt{ background:#fff;}
/* Dynamics 365 highlight and details sections */
.dynamics-highlight {
  background: linear-gradient(180deg, #ffffff 0%, #f4f9ff 100%);
  text-align: center;
}

.dynamics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}

.dynamics-card {
  background: #fff;
  border: 1px solid #e6ecf3;
  border-radius: 12px;
  padding: 1.2rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.dynamics-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(11, 110, 253, 0.1);
}

.dynamics-card img {
  height: 60px;
  margin-bottom: 0.8rem;
}

.dynamics-card h3 {
  color: var(--primary);
  margin-bottom: 0.4rem;
}

.dynamics-card p {
  font-size: 0.95rem;
  color: #444;
}

/* Detailed section */
.dynamics-details {
  background: #fff;
}

.dynamics-detail {
  margin-bottom: 2rem;
  padding: 1.2rem;
  border-left: 4px solid var(--primary);
  background: #f9fbff;
  border-radius: 10px;
}

.dynamics-detail.alt {
  background: #fff;
  border-left: 4px solid #1b6efc;
}

.dynamics-detail h3 {
  color: var(--primary);
  margin-bottom: 0.4rem;
}

.dynamics-detail ul {
  margin-top: 0.6rem;
  padding-left: 1.2rem;
}

.dynamics-detail li {
  margin-bottom: 0.3rem;
}

.dynamics-summary {
  background: #f3f8ff;
  padding: 1.5rem;
  border-radius: 12px;
  margin-top: 1rem;
}

.dynamics-summary h4 {
  color: var(--primary);
  margin-bottom: 0.5rem;
}

.dynamics-summary ul {
  margin: 0.5rem 0 1rem 1.2rem;
}

.center {
  text-align: center;
  margin-top: 1.2rem;
}