/* ============================================================
   Salesforce Service single-post — section box styles
   Ported from Theme-design/services-page/v3 (locked v15 set).
   Scoped under .single-service so the broad .grid-2/.grid-3 > .card
   overrides never leak to the homepage / about-page card grids.
   ============================================================ */

/* v5 — accent-bar cards (grid-3) */
.single-service .grid-3 > .card { border-top: 5px solid var(--ah-blue); }
.single-service .grid-3 > .card:nth-child(3n+2) { border-top-color: var(--ah-green); }
.single-service .grid-3 > .card:nth-child(3n)   { border-top-color: var(--ah-pink); }

/* v6 — left-icon row cards (grid-2) */
.single-service .grid-2 > .card { flex-direction: row; align-items: flex-start; gap: var(--sp-4); }
.single-service .grid-2 > .card .card-icon { flex: 0 0 64px; margin-bottom: 0; }
.single-service .grid-2 > .card .card-body { display: flex; flex-direction: column; }
.single-service .grid-2 > .card:nth-child(2n+1) .card-icon { background: var(--ah-blue); }
.single-service .grid-2 > .card:nth-child(2n)   .card-icon { background: var(--ah-green); }
.single-service .card .card-icon img { width: 32px; height: 32px; object-fit: contain; filter: brightness(0) invert(1); }

/* v12 — icon + text rows (no box) */
.single-service .feat-rows { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-6) var(--sp-8); margin-top: var(--sp-6); }
.single-service .feat-irow { display: flex; gap: var(--sp-4); align-items: flex-start; }
.single-service .feat-ico { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 50%; background: var(--ah-blue); display: inline-flex; align-items: center; justify-content: center; }
.single-service .feat-ico img { width: 24px; height: 24px; object-fit: contain; filter: brightness(0) invert(1); }
.single-service .feat-rows > .feat-irow:nth-child(4n+2) .feat-ico { background: var(--ah-green); }
.single-service .feat-rows > .feat-irow:nth-child(4n+3) .feat-ico { background: var(--ah-pink); }
.single-service .feat-rows > .feat-irow:nth-child(4n+4) .feat-ico { background: var(--ah-yellow); }
.single-service .feat-irow h4 { margin-bottom: var(--sp-1); color: var(--ah-navy); }
.single-service .feat-irow p { margin: 0; color: var(--c-text-soft); font-size: var(--fs-sm); }

/* v11 — two-column divider list (no box) */
.single-service .feat-cols { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-5) var(--sp-8); margin-top: var(--sp-6); }
.single-service .feat-row { padding-bottom: var(--sp-5); border-bottom: 1px dashed var(--c-border); }
.single-service .feat-row h4 { margin-bottom: var(--sp-2); color: var(--ah-navy); }
.single-service .feat-row p { margin: 0; color: var(--c-text-soft); font-size: var(--fs-sm); }

@media (max-width: 768px) {
    .single-service .feat-rows,
    .single-service .feat-cols { grid-template-columns: 1fr; }
}