/* ===== Services page ===== */

/* Page hero inherits base .page-hero; tweak subtitle spacing if needed */
.page-hero p { margin-top: 6px; }

/* Headings inside sections */
.section-title { margin: 0 0 18px; }

/* Core services grid */
.services-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 3vw, 24px);
}

@media (max-width: 900px){
  .services-grid { grid-template-columns: 1fr; }
}

.service h3 { margin-top: 0; }

.check{
  list-style:none; padding:0; margin:12px 0 0 0;
}
.check li{
  position:relative; padding-left:26px; margin:10px 0;
}
.check li::before{
  content:""; position:absolute; left:0; top:8px;
  width:10px; height:10px; border-radius:2px;
  background: var(--brand);
  box-shadow: 0 0 0 3px rgba(11,92,173,.16);
}

/* Add-ons */
.addon-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: clamp(16px, 3vw, 24px);
}
@media (max-width: 900px){
  .addon-grid { grid-template-columns: 1fr; }
}
.addon h4{ margin:.2rem 0 .4rem 0; }

/* Pricing block */
.pricing{
  display:grid;
  gap:14px;
  align-items:start;
}
.pricing .btn{ width:max-content; }

/* Dotted list */
.dots{
  list-style:none; padding:0; margin:6px 0 4px;
}
.dots li{
  position:relative; padding-left:18px; margin:8px 0;
}
.dots li::before{
  content:"•"; position:absolute; left:0; top:-1px;
  color: var(--brand); font-weight:700;
}

/* FAQs */
.faq{
  display:grid;
  gap:12px;
}
.faq details.card{
  padding:16px 18px;
  cursor:pointer;
}
.faq summary{
  font-weight:700;
  outline:none;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:"＋";
  float:right;
  color: var(--brand);
  font-weight:700;
}
.faq details[open] summary::after{ content:"–"; }
.faq p{ margin:.6rem 0 0; color: var(--muted); }

/* CTA inherits .section + center text */
.cta{ text-align:center; }
.cta p{ color: var(--muted); margin-bottom:16px; }