/* The Services page (templates/page-services.html; handoff S:1200-1411, S = "Salvagente Site.dc.html"). Phase 5c Task 6.
   Small text is 12px at least; muted text uses the AA greys (the handoff's #727374 is under 4.5:1 on both the page and the band). */

.wp-site-blocks > .sv-services { margin-block-start: 0; }
.sv-services > * { margin-block: 0; }
:where(.sv-services) :where(p, h1, h2, dl, dd, ul) { margin: 0; }   /* zero specificity: every margin below wins */
.sv-services :where(.is-layout-flow, .is-layout-constrained) > * { margin-block: 0; }
.sv-services .sv-eyebrow { font-size: 13px; letter-spacing: .18em; text-transform: uppercase; color: var(--wp--preset--color--ink-600); }
.sv-services-h2 {
	margin-top: 12px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 28px;
	line-height: 1.12;
	letter-spacing: -.02em;
	color: var(--wp--preset--color--ink-900);
}
.sv-fees-note { margin-top: 10px; font-size: 13px; color: var(--wp--preset--color--ink-600); }
.sv-fees-note a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }   /* the note's AA grey, underlined (decision 86) */

/* ---- hero and the coming-soon card (S:1203-1285) ---- */
.sv-services-top { display: grid; grid-template-columns: minmax(0, 1fr) 470px; gap: 44px; align-items: start; padding: 52px var(--pg) 0; }
.sv-services-h1 {
	margin-top: 14px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: clamp(28px, 3.6vw, 52px);
	line-height: 1.04;
	letter-spacing: -.025em;
	text-wrap: pretty;
	color: var(--wp--preset--color--ink-900);
}
.sv-services-lede { max-width: 660px; margin-top: 20px; font-size: 17.5px; line-height: 1.6; text-wrap: pretty; color: var(--wp--preset--color--ink-700); }
/* Two stats or three (the rate stat is fail-closed, R17): one equal column each. */
.sv-services-stats { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 28px; margin-top: 34px; padding-top: 26px; border-top: 1px solid var(--sv-stroke-hair); }
.sv-services-stats > div { display: flex; flex-direction: column; min-width: 0; }
.sv-services-stats .sv-metric { order: -1; font-size: 38px; font-weight: 400; line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: var(--wp--preset--color--ink-900); }
.sv-services-stats .sv-label { margin-top: 6px; font-size: 12px; color: var(--wp--preset--color--ink-900); }
.sv-services-stats .sv-mono { margin-top: 5px; font-size: 12px; letter-spacing: .06em; color: var(--wp--preset--color--ink-600); }
.sv-services-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.sv-services .sv-pill.is-dark { box-shadow: 0 0 0 1px rgba(77, 197, 213, .6), 0 10px 26px -12px rgba(12, 13, 14, .7); }
.sv-services .sv-pill.is-outline { border-color: var(--wp--preset--color--grey); background: transparent; color: #3d3e40; }
.sv-services-soon { padding: 26px 28px; }
.sv-services-soon .sv-label { padding-right: 80px; font-size: 12px; color: var(--wp--preset--color--ink-900); }   /* clear of the ribbon */
.sv-services-soon-line { margin-top: 14px; padding-right: 40px; font-size: 16px; line-height: 1.55; color: var(--wp--preset--color--ink-700); }
.sv-services-soon .sv-pill { margin-top: 22px; }

/* ---- the two cards (S:1288-1369) ---- */
.sv-services-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; padding: 88px var(--pg) 0; }
.sv-services-card { padding: 36px 38px; }
.sv-services-card.is-clients { border: 1.5px solid var(--wp--preset--color--primary); box-shadow: 0 20px 48px -26px rgba(77, 197, 213, .85); }
.sv-feature-rows { margin-top: 22px; padding: 0; list-style: none; }
.sv-feature-rows li { position: relative; padding: 11px 0 11px 17px; border-bottom: 1px solid var(--sv-stroke-hair); font-size: 15.5px; line-height: 1.5; color: var(--wp--preset--color--ink-700); }
.sv-feature-rows li::before { content: ""; position: absolute; left: 0; top: 19px; width: 5px; height: 5px; border-radius: 99px; background: var(--wp--preset--color--teal-deep); }

/* ---- the fees band (S:1372-1408): two columns only while a worked example renders (R14, R17) ---- */
.sv-fees { margin-top: 88px; padding: 66px var(--pg) 70px; background: #0b0c0d; }
.sv-fees:has(.sv-worked) { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 44px; align-items: center; }
.sv-fees .sv-eyebrow { margin-bottom: 14px; font-size: 12px; letter-spacing: .22em; color: var(--wp--preset--color--primary); }
.sv-fees .sv-services-h2 { margin-top: 0; font-size: clamp(22px, 2.4vw, 34px); line-height: 1.1; color: #fff; }
.sv-fees-main { text-align: center; }
.sv-fees-lede { max-width: 620px; margin: 16px auto 0; font-size: 16.5px; line-height: 1.6; color: var(--wp--preset--color--on-dark-dim); }
.sv-worked-title, .sv-worked .is-total dt { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--wp--preset--color--grey-aa); }
.sv-worked-title b { font-family: var(--wp--preset--font-family--display); font-weight: 700; letter-spacing: .08em; color: #fff; }
.sv-worked > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.sv-worked > .is-total { padding: 16px 0 0; border-bottom: 0; }
.sv-worked dt { font-size: 15px; color: var(--wp--preset--color--on-dark); }
.sv-worked dd { font-size: 22px; line-height: 1; font-variant-numeric: tabular-nums; color: var(--wp--preset--color--on-dark-dim); }
.sv-worked > div:first-child dd { color: #fff; }
.sv-worked .is-total dd { font-size: clamp(22px, 2.4vw, 34px); color: var(--wp--preset--color--primary); }
.sv-worked-settle { margin-top: 10px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--wp--preset--color--grey-aa); }
.sv-fees .sv-fees-note { color: var(--wp--preset--color--grey-aa); }

@media (max-width: 1100px) {
	.sv-services-top, .sv-fees:has(.sv-worked) { grid-template-columns: minmax(0, 1fr); }
	.sv-fees-example { max-width: 520px; margin-inline: auto; }   /* Ana exit S1: labels and figures stay readable across */
}
@media (max-width: 720px) {
	.sv-services-stats { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sv-services-cols { grid-template-columns: minmax(0, 1fr); }
	.sv-services-card { padding: 28px 22px; }
	.sv-services-ctas .sv-pill { white-space: normal; }
}