/* ── SERVICES — DARK THEME ─────────────────────────────── */
.svc-card { background: var(--navy-2); border: 1px solid var(--card-border); border-radius: var(--r-2xl); overflow: hidden; margin-bottom: 20px; transition: var(--t); }
.svc-card:hover { border-color: rgba(27,79,138,.55); box-shadow: 0 20px 60px rgba(0,0,0,.5); }
.svc-card--flagship { border-color: rgba(245,166,35,.32); }
.svc-header { padding: 28px 28px 20px; display: grid; grid-template-columns: 1fr; gap: 16px; border-bottom: 1px solid rgba(27,79,138,.18); }
@media (min-width: 640px) { .svc-header { grid-template-columns: 1fr auto; align-items: start; padding: 32px 36px 24px; } }
.svc-num { font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--gold); margin-bottom: 8px; }
.flagship-badge { display: inline-block; background: rgba(245,166,35,.12); border: 1px solid rgba(245,166,35,.32); color: var(--gold); padding: 3px 11px; border-radius: var(--r-sm); font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 8px; }
.svc-icon { font-size: 32px; margin-bottom: 10px; display: block; }
.svc-title { font-family: var(--font-ui); font-weight: 800; font-size: clamp(20px,3vw,26px); color: var(--white); margin-bottom: 8px; line-height: 1.2; }
.svc-desc { font-size: 14px; color: var(--muted); line-height: 1.78; }
.svc-kpis { display: flex; flex-direction: row; gap: 20px; }
@media (min-width: 640px) { .svc-kpis { flex-direction: column; align-items: flex-end; } }
.kpi-val { font-family: var(--font-ui); font-weight: 800; font-size: 26px; color: var(--gold); line-height: 1; display: block; }
.kpi-label { font-size: 10px; color: var(--muted); margin-top: 2px; display: block; }
@media (min-width: 640px) { .kpi-val,.kpi-label { text-align: right; } }
.svc-body { padding: 20px 28px 28px; }
@media (min-width: 640px) { .svc-body { padding: 24px 36px 32px; } }
.svc-specs-row { background: var(--navy); border-radius: var(--r-lg); padding: 18px; display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-bottom: 20px; }
.spec-val { font-family: var(--font-ui); font-weight: 700; font-size: clamp(14px,2vw,18px); color: var(--white); display: block; margin-bottom: 2px; }
.spec-label { font-size: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: 1px; }
.svc-features { display: grid; gap: 9px; margin-bottom: 18px; }
@media (min-width: 640px) { .svc-features { grid-template-columns: 1fr 1fr; } }
.svc-feat { display: flex; gap: 9px; align-items: flex-start; font-size: 13px; color: var(--muted-2); line-height: 1.5; }
.feat-chk { width: 20px; height: 20px; min-width: 20px; border-radius: 5px; background: rgba(245,166,35,.1); border: 1px solid rgba(245,166,35,.25); display: flex; align-items: center; justify-content: center; font-size: 10px; color: var(--gold); margin-top: 1px; }
.svc-tags { display: flex; gap: 8px; flex-wrap: wrap; }
.process-steps { display: flex; flex-direction: column; gap: 20px; margin-top: 40px; position: relative; }
@media (min-width: 768px) {
  .process-steps { flex-direction: row; }
  .process-steps::before { content: ''; position: absolute; top: 22px; left: 8%; right: 8%; height: 2px; background: linear-gradient(90deg, var(--gold), var(--blue-glow)); }
}
.ps { text-align: center; position: relative; z-index: 1; flex: 1; }
.ps-dot { width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, var(--gold), var(--blue-2)); display: flex; align-items: center; justify-content: center; font-family: var(--font-ui); font-weight: 800; font-size: 14px; color: var(--navy); margin: 0 auto 12px; box-shadow: 0 4px 16px rgba(245,166,35,.3); }
.ps-title { font-family: var(--font-ui); font-weight: 700; font-size: 13px; color: var(--white); margin-bottom: 4px; }
.ps-text { font-size: 11px; color: var(--muted); line-height: 1.5; padding: 0 6px; }