/* ==========================================================
   services.css — minimal, consolidated
   Scope: single service pages (and safe fallback on single-service content)
   Goals: normal-weight body text, tighter spacing, clear blue links
   ========================================================== */

/* ---- Tunables (adjust these few values) ---- */
:root{
  --svc-line: 1.58;           /* paragraph + list line-height */
  --svc-p-gap: .8rem;         /* paragraph bottom margin */
  --svc-h2-top: 1.4rem;       /* space above H2 */
  --svc-h2-bot: .6rem;        /* space below H2 */
  --svc-h3-top: 1.0rem;       /* space above H3 */
  --svc-h3-bot: .4rem;        /* space below H3 */
  --svc-gap-tight: .4rem;     /* when a heading follows text/list */
  --svc-list-top: .6rem;      /* top margin for UL/OL */
  --svc-list-bot: 1rem;       /* bottom margin for UL/OL */
  --svc-block-gap: .8rem;     /* Gutenberg block gap inside services */
  --svc-blue: #005bac;        /* link color */
  --svc-blue-hover: #004a94;  /* link hover color */
  --svc-bg: #f9f9fb;          /* page background (if you use it) */
}

/* ---- Context helper (service content area) ---- */
.p-service, .p-service-detail, 
body.single-service .entry-content{
  line-height: var(--svc-line);
  font-weight: 400;
}

/* Optional page background for service experiences */
body.single-service{ background: var(--svc-bg); }

/* ---- Headings & top intro spacing ---- */
.p-service-detail h1,
body.single-service .entry-content h1{
  margin: 0 0 1.2rem;
}

.p-service-detail h2,
body.single-service .entry-content h2{
  margin: var(--svc-h2-top) 0 var(--svc-h2-bot);
  font-weight: 700;
}

.p-service-detail h3,
body.single-service .entry-content h3{
  margin: var(--svc-h3-top) 0 var(--svc-h3-bot);
  font-weight: 700;
}

/* If a heading follows text/list, keep the gap tight */
.p-service-detail p + h2,
.p-service-detail p + h3,
.p-service-detail ul + h2,
.p-service-detail ul + h3,
.p-service-detail ol + h2,
.p-service-detail ol + h3,
body.single-service .entry-content p + h2,
body.single-service .entry-content p + h3,
body.single-service .entry-content ul + h2,
body.single-service .entry-content ul + h3,
body.single-service .entry-content ol + h2,
body.single-service .entry-content ol + h3{
  margin-top: var(--svc-gap-tight) !important;
}

/* ---- Paragraphs (normal weight, compact spacing) ---- */
.p-service-detail p,
.p-service-detail .wp-block-paragraph,
body.single-service .entry-content p,
body.single-service .entry-content .wp-block-paragraph{
  margin: 0 0 var(--svc-p-gap);
  line-height: var(--svc-line);
  font-weight: 400 !important;   /* kill semi-bold bleed from theme */
}
.p-service-detail p:empty,
body.single-service .entry-content p:empty{ display:none; }

/* ---- Lists ---- */
.p-service-detail ul,
.p-service-detail ol,
body.single-service .entry-content ul,
body.single-service .entry-content ol{
  margin: var(--svc-list-top) 0 var(--svc-list-bot) 1.4rem;
  padding: 0;
}
.p-service-detail li,
body.single-service .entry-content li{
  margin: .35rem 0;
  line-height: var(--svc-line);
  font-weight: 400 !important;
}

/* ---- Links (lighter feel; remove heavy border underline) ---- */
.p-service-detail a,
body.single-service .entry-content a{
  color: var(--svc-blue);
  font-weight: 400 !important;
  text-decoration: underline;              /* classic underline = lighter look */
  text-underline-offset: .18em;
  text-decoration-thickness: .08em;
  transition: color .2s ease;
}
.p-service-detail a:hover,
body.single-service .entry-content a:hover{
  color: var(--svc-blue-hover);
}

/* Heading links should look like headings, not inline links */
.p-service-detail h2 a,
.p-service-detail h3 a,
body.single-service .entry-content h2 a,
body.single-service .entry-content h3 a{
  color: inherit;
  text-decoration: none;
  font-weight: 700 !important;
}
.p-service-detail h2 a:hover,
.p-service-detail h3 a:hover,
body.single-service .entry-content h2 a:hover,
body.single-service .entry-content h3 a:hover{
  text-decoration: underline;
}

/* ---- CTA block (centered, clear size) ---- */
.p-service__cta{
  text-align: center;
  margin: 2rem auto;
  padding: 1.6rem;
  background: #fff;
  border: 1px solid #e8e8ef;
  border-radius: .8rem;
  box-shadow: 0 4px 12px rgba(0,0,0,.04);
}
.p-service__cta p{ margin: .8rem auto; max-width: 70ch; }
.p-service__cta .c-button{
  display: inline-block;
  margin: 1rem auto 0;
  font-size: 1.6rem;
  padding: 1rem 2rem;
}

/* ---- Gutenberg block gap normalization (inside services only) ---- */
.p-service-detail .is-layout-flow,
.p-service-detail .is-layout-constrained,
.p-service-detail .is-layout-flex,
body.single-service .entry-content.is-layout-flow,
body.single-service .entry-content .is-layout-flow,
body.single-service .entry-content .is-layout-constrained,
body.single-service .entry-content .is-layout-flex{
  --wp--style--block-gap: var(--svc-block-gap);
}

/* ---- Pager strip (match background) ---- */
.c-pager{ background: var(--svc-bg); padding: 2rem 0; }


/* Force light-gray page background on service pages */
body.single-service,
body.post-type-archive-service {
  background-color: var(--bg) !important; /* #f9f9fb */
}

/* Ensure inner wrappers don't paint white over it */
body.single-service .site-main,
body.single-service .content-area,
body.single-service .entry-content,
body.single-service .l-container,
body.post-type-archive-service .site-main,
body.post-type-archive-service .content-area,
body.post-type-archive-service .entry-content,
body.post-type-archive-service .l-container {
  background: transparent !important;
}

/* Your main service band should also be the same light gray */
.p-service-detail.c-page-detail,
.c-pager {
  background: var(--bg) !important; /* keep pager matching too */
}

/* If any Gutenberg block was given a white background in the editor, neutralize it here: */
.p-service-detail .has-background {
  background-color: transparent !important; /* comment this out if you intentionally use colored blocks */
}

/* CTA/Button: force brand color + remove link underline rules */
.c-button,
.p-service-detail a.c-button,
.p-service__cta a.c-button {
  display: inline-block;
  background: var(--brand-blue);
  color: #fff !important;
  text-decoration: none !important;
  border: 0 !important;              /* kill the 1px link underline */
  border-bottom: none !important;
  font-weight: 600;
  padding: 1.2rem 2.4rem;
  border-radius: .8rem;
  transition: background .2s ease;
}
.c-button:hover,
.p-service-detail a.c-button:hover,
.p-service__cta a.c-button:hover {
  background: var(--blue-hover);
  color: #fff !important;
}

/* Keep normal link styling for everything else */
.p-service-detail a:not(.c-button) {
  color: var(--brand-blue);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}
.p-service-detail a:not(.c-button):hover {
  color: var(--blue-hover);
}