/* TK Web Studio — Services page readability pass
   Scoped to services.html only. Keeps the charcoal + warm-orange brand while
   removing low-contrast legacy treatments from dark sections. */

.services-page {
  --services-copy: #eee4dc;
  --services-copy-strong: #fffaf6;
  --services-copy-soft: #d8cbc1;
  --services-line: rgba(255, 117, 75, .30);
  --services-line-soft: rgba(255, 117, 75, .17);
  --services-panel: #242220;
  --services-panel-strong: #2b2724;
}

.services-page .services-hero {
  color: var(--services-copy-strong);
  background:
    radial-gradient(circle at 84% 14%, rgba(255, 117, 75, .12), transparent 30%),
    linear-gradient(135deg, rgba(189, 57, 19, .22), transparent 46%),
    linear-gradient(180deg, #171717 0%, #211e1c 100%);
}
.services-page .services-hero::before {
  opacity: .22;
  background-image:
    linear-gradient(rgba(255, 117, 75, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 117, 75, .07) 1px, transparent 1px);
}
.services-page .services-hero :is(h1,h2,h3) { color: var(--services-copy-strong); }
.services-page .services-hero .lead { color: var(--services-copy); font-size: clamp(17px, 1.5vw, 19px); line-height: 1.72; }
.services-page .services-hero__proof { color: var(--services-copy-strong); font-size: 14px; }
.services-page .services-hero__proof li::before { box-shadow: 0 0 0 4px rgba(255, 117, 75, .12); }

.services-page .services-journey {
  color: var(--services-copy-strong);
  border-color: var(--services-line);
  background: linear-gradient(160deg, rgba(255,255,255,.09), rgba(255,117,75,.035));
  backdrop-filter: none;
}
.services-page .services-journey::after { border-color: rgba(255,117,75,.08); }
.services-page .services-journey :is(h2,h3) { color: var(--services-copy-strong); }
.services-page .services-journey li,
.services-page .services-journey__note { border-color: var(--services-line-soft); }
.services-page .services-journey li > span { border-color: rgba(255,117,75,.42); color: #ffc0aa; }
.services-page .services-journey strong { color: var(--services-copy-strong); font-size: 17px; }
.services-page .services-journey li p,
.services-page .services-journey__note { color: var(--services-copy); font-size: 15px; line-height: 1.62; }

/* Critical contrast contract for the dark outcome section. */
.services-page .services-routes {
  color: var(--services-copy-strong);
  background: linear-gradient(180deg, rgba(255,117,75,.035), transparent 24%), #1b1b1b;
}
.services-page .services-routes :is(h2,h3) { color: var(--services-copy-strong) !important; }
.services-page .services-routes__head .eyebrow { color: #ffb099 !important; }
.services-page .services-routes__head > p:not(.eyebrow) { color: var(--services-copy) !important; font-size: 18px; line-height: 1.68; }
.services-page .services-route {
  color: var(--services-copy-strong);
  border-color: var(--services-line);
  background: linear-gradient(180deg, var(--services-panel-strong), var(--services-panel));
}
.services-page .services-route--primary {
  border-color: rgba(255,117,75,.48);
  background: radial-gradient(circle at 90% 0, rgba(255,117,75,.11), transparent 34%), linear-gradient(180deg, rgba(189,57,19,.14), #242220 48%);
}
.services-page .services-route__label span { border-color: rgba(255,117,75,.40); color: #ffc0aa; }
.services-page .services-route__label p { color: #fff1e8; font-size: 13px; }
.services-page .services-route__fit { color: var(--services-copy); font-size: 16px; line-height: 1.66; }
.services-page .services-route__fit strong { color: #fff; }
.services-page .services-route__plan { border-color: var(--services-line-soft); }
.services-page .services-route__plan span { color: #ffb099; font-size: 11px; }
.services-page .services-route__plan p { color: var(--services-copy-soft); font-size: 15px; line-height: 1.64; }
.services-page .services-route__link { color: #fff; font-size: 14px; }

.services-page .services-care-band {
  color: var(--services-copy-strong);
  border-color: var(--services-line);
  background: linear-gradient(110deg, rgba(189,57,19,.25), rgba(255,117,75,.055) 70%), #242220;
}
.services-page .services-care-band :is(h2,h3) { color: var(--services-copy-strong); }
.services-page .services-care-band > div > p:last-child { color: var(--services-copy); font-size: 16px; line-height: 1.65; }

.services-page .services-automation { color: var(--services-copy-strong); }
.services-page .services-automation :is(h2,h3) { color: var(--services-copy-strong) !important; }
.services-page .services-automation .head > p:not(.eyebrow) { color: var(--services-copy); font-size: 17px; line-height: 1.68; }
.services-page .services-guardrails { color: var(--services-copy-strong); border-color: var(--services-line); background: #242220; }
.services-page .services-guardrails > div + div { border-color: var(--services-line-soft); }
.services-page .services-guardrails__label { color: var(--services-copy-strong); font-size: 13px; }
.services-page .services-guardrails ul { color: var(--services-copy); font-size: 15px; line-height: 1.58; }
.services-page .services-guardrails li::marker { color: #ff754b; }

.services-page .services-next { color: var(--services-copy-strong); }
.services-page .services-next :is(h2,h3) { color: var(--services-copy-strong) !important; }
.services-page .services-next__box {
  border-color: var(--services-line);
  background: radial-gradient(circle at 92% 18%, rgba(255,117,75,.10), transparent 28%), linear-gradient(130deg, rgba(189,57,19,.17), #242220);
}
.services-page .services-next__box > div > p:last-child { color: var(--services-copy); font-size: 16px; line-height: 1.67; }
.services-page .services-links span { color: #cdbeb3; }
.services-page .services-links a { border-color: var(--services-line-soft); color: #fff1e8; font-size: 13px; }
.services-page .services-links a:hover { border-color: rgba(255,117,75,.48); background: rgba(255,117,75,.09); }

@media (max-width:760px) {
  .services-page .services-routes__head > p:not(.eyebrow),
  .services-page .services-automation .head > p:not(.eyebrow) { font-size: 17px; }
  .services-page .services-route__fit,
  .services-page .services-route__plan p,
  .services-page .services-journey li p,
  .services-page .services-journey__note,
  .services-page .services-guardrails ul,
  .services-page .services-care-band > div > p:last-child,
  .services-page .services-next__box > div > p:last-child { font-size: 16px; }
  .services-page .services-guardrails > div + div { border-top-color: var(--services-line-soft); }
}
@media (max-width:430px) {
  .services-page .services-route,
  .services-page .services-care-band,
  .services-page .services-journey,
  .services-page .services-guardrails > div { padding: 24px; }
  .services-page .services-route__label { margin-bottom: 24px; }
}
