/* Product presentation inspired by the clarity of TransIP and Microsoft. */
.microsoft-core { gap: 13px; }
.ms-grid { display: grid; grid-template-columns: repeat(2, 18px); grid-template-rows: repeat(2, 18px); gap: 3px; }
.ms-grid i:nth-child(1) { background: #f25022; }
.ms-grid i:nth-child(2) { background: #7fba00; }
.ms-grid i:nth-child(3) { background: #00a4ef; }
.ms-grid i:nth-child(4) { background: #ffb900; }

.services { background: #f4f7fb; color: var(--text); border-top: 1px solid #e4ebf3; border-bottom: 1px solid #e4ebf3; }
.section-head.light h2 { color: var(--navy); }
.section-head.light > p:last-child { color: var(--muted); }
.service-grid { gap: 18px; }
.service-card,
.service-card:nth-child(4),
.service-card:nth-child(5) {
  grid-column: span 2;
  min-height: 470px;
  padding: 34px;
  border: 1px solid #dce5ef;
  border-radius: 10px;
  background: #fff;
  color: var(--text);
  box-shadow: 0 4px 14px rgba(14, 35, 60, .04);
  display: flex;
  flex-direction: column;
}
.service-card:hover { transform: translateY(-3px); border-color: #72aef7; background: #fff; box-shadow: 0 13px 35px rgba(19, 74, 136, .1); }
.service-card.featured { background: #fff; border-top: 4px solid #0078d4; }
.service-card.featured::after { display: none; }
.service-card .icon { border-radius: 8px; background: #eaf3fc; }
.service-card svg { stroke: #0078d4; }
.service-card .number { color: #99a9ba; }
.service-card h3 { font-size: 1.36rem; color: #142033; margin: 24px 0 10px; }
.service-card > p:not(.number) { color: #607086; font-size: .88rem; }
.service-card ul { border-top: 1px solid #e5ebf1; margin: 0 0 20px; padding-top: 14px; }
.service-card li { color: #3d4d61; font-size: .79rem; }
.service-card li::before { content: "✓"; color: #0078d4; font-weight: 800; }
.card-link { position: relative; z-index: 2; margin-top: auto; color: #0067b8; font-size: .82rem; font-weight: 800; }
.card-link span { margin-left: 7px; }
.card-link:hover { text-decoration: underline; }
.copilot-icon { background: linear-gradient(135deg, #e9e7ff, #ddf7fb) !important; }
.copilot-icon span { font-size: 1.6rem; color: #6750e6; }

@media (max-width: 900px) {
  .service-card,
  .service-card:nth-child(4),
  .service-card:nth-child(5) { grid-column: span 1; }
}
@media (max-width: 620px) {
  .service-card,
  .service-card:nth-child(4),
  .service-card:nth-child(5) { min-height: 0; }
}