/* ==========================================================================
   Service page toolkit — a set of section "components" (hero + signature graphic,
   prose, meta strip, compare table, process track, dark section, promise stat,
   crosslink, pills, final CTA). Adapted from the Bookkeeping mockup into the
   site's fonts (Brother1816 / Montserrat) and palette (navy / orange / teal).
   Everything is scoped under .svc-page and prefixed sp- so it never collides
   with the global site CSS.
   ========================================================================== */
.svc-page{--disp:'Brother1816',sans-serif;--text:'Montserrat',sans-serif;--spmax:1200px;
  font-family:var(--text);color:var(--muted);background:var(--white);line-height:1.7}
.svc-page .sp-wrap{max-width:var(--spmax);margin:0 auto;padding:0 32px}
.svc-page h1,.svc-page h2,.svc-page h3,.svc-page h4,.svc-page h5,.svc-page h6{font-family:var(--disp);color:var(--navy);line-height:1.1;letter-spacing:.5px}
.svc-page em.sp-ac{font-style:normal;color:var(--or)}
.svc-page a{color:inherit}

/* buttons */
.svc-page .sp-btn{display:inline-block;font-family:var(--disp);font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:15px 32px;text-decoration:none;transition:.2s;cursor:pointer;border:none}
.svc-page .sp-btn-primary{background:var(--or);color:#fff}
.svc-page .sp-btn-primary:hover{background:#e86a26}
.svc-page .sp-btn-ghost{border:1px solid var(--border);color:var(--navy);background:transparent}
.svc-page .sp-btn-ghost:hover{border-color:var(--b);color:var(--b)}

/* eyebrow / section head */
.svc-page .sp-eyebrow{font-family:var(--disp);font-size:12px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--b);margin-bottom:20px}
.svc-page .sp-eyebrow.on-dark{color:var(--or)}
.svc-page section.sp-sec{padding:92px 0}
.svc-page .sp-pale{background:var(--bg)}
.svc-page h2.sp-h2{font-size:clamp(28px,3.6vw,44px);font-weight:700;text-transform:uppercase;margin-bottom:20px;letter-spacing:1px}
.svc-page .sp-head{max-width:780px;margin-bottom:48px}
.svc-page .sp-head p{font-size:17px}
.svc-page .sp-prose{max-width:800px;font-size:16.5px}
.svc-page .sp-prose p+p{margin-top:18px}

/* pills */
.svc-page .sp-pills{display:flex;flex-wrap:wrap;gap:9px;margin-top:32px}
.svc-page .sp-pill{font-family:var(--disp);font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--or);border:1px solid var(--or);padding:8px 14px}

/* HERO */
.svc-page .sp-hero{background:linear-gradient(180deg,var(--bg) 0%,#fff 100%);padding:88px 0 0;position:relative;overflow:hidden}
.svc-page .sp-hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(var(--border) 1.4px,transparent 1.4px);background-size:22px 22px;opacity:.5;pointer-events:none}
.svc-page .sp-hero-in{position:relative;max-width:940px}
.svc-page .sp-hero h1{font-size:clamp(38px,6vw,72px);font-weight:700;text-transform:uppercase;line-height:1.02}
.svc-page .sp-hero h1 span{display:block}
.svc-page .sp-hero .sp-lead{font-size:clamp(17px,2vw,20px);max-width:600px;margin:28px 0 36px;line-height:1.6}
.svc-page .sp-hero-cta{display:flex;gap:14px;flex-wrap:wrap;padding-bottom:72px}

/* SIGNATURE: reconcile split (two sources -> merged output) */
.svc-page .sp-sig{position:relative;padding:0 0 84px}
.svc-page .sp-split{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.svc-page .sp-src{background:#fff;border:1px solid var(--border);border-top:3px solid var(--b);padding:26px 28px 28px;box-shadow:0 14px 34px -26px rgba(10,22,40,.5)}
.svc-page .sp-src.alt{border-top-color:var(--or)}
.svc-page .sp-src .sp-tag{font-family:var(--disp);font-size:10px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted)}
.svc-page .sp-src h4{font-size:19px;font-weight:700;margin:8px 0 16px;letter-spacing:.5px}
.svc-page .sp-src ul{list-style:none;font-size:14px;line-height:2}
.svc-page .sp-src li{border-bottom:1px dashed var(--border);display:flex;justify-content:space-between;gap:14px}
.svc-page .sp-src li span{color:var(--navy);opacity:.4;font-variant-numeric:tabular-nums;font-size:11.5px}
.svc-page .sp-merge{display:flex;flex-direction:column;align-items:center}
.svc-page .sp-chev{height:48px;width:2px;background:linear-gradient(180deg,var(--border),var(--b));margin-top:30px}
.svc-page .sp-out{background:var(--navy);color:#fff;padding:32px 38px;text-align:center;border-top:3px solid var(--or);margin-top:2px}
.svc-page .sp-out .sp-tag{color:var(--or)}
.svc-page .sp-out h4{color:#fff;font-size:23px;margin:8px 0 8px;letter-spacing:.5px}
.svc-page .sp-out p{color:rgba(255,255,255,.62);font-size:14.5px;max-width:580px;margin:0 auto}

/* SIGNATURE: horizontal flow */
.svc-page .sp-flow{display:grid;gap:0;grid-auto-flow:column;grid-auto-columns:1fr;border:1px solid var(--border);background:#fff;box-shadow:0 14px 34px -26px rgba(10,22,40,.5)}
.svc-page .sp-flow-step{padding:26px 22px;border-right:1px solid var(--border);position:relative}
.svc-page .sp-flow-step:last-child{border-right:0}
.svc-page .sp-flow-step .n{font-family:var(--disp);font-size:11px;font-weight:700;letter-spacing:1.5px;color:var(--b)}
.svc-page .sp-flow-step:last-child .n{color:var(--or)}
.svc-page .sp-flow-step h4{font-size:16px;font-weight:700;margin:10px 0 6px;letter-spacing:.5px}
.svc-page .sp-flow-step p{font-size:13px;line-height:1.55}
.svc-page .sp-flow-step:last-child{background:var(--navy)}
.svc-page .sp-flow-step:last-child h4{color:#fff}
.svc-page .sp-flow-step:last-child p{color:rgba(255,255,255,.6)}

/* SIGNATURE: 12-month calendar */
.svc-page .sp-cal{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;background:#fff;border:1px solid var(--border);padding:24px;box-shadow:0 14px 34px -26px rgba(10,22,40,.5)}
.svc-page .sp-cal-c{border:1px solid var(--border);padding:14px 12px;min-height:78px}
.svc-page .sp-cal-c .mo{font-family:var(--disp);font-size:10px;font-weight:700;letter-spacing:1.5px;color:var(--b)}
.svc-page .sp-cal-c .fo{font-size:12px;color:var(--navy);font-weight:600;margin-top:6px;line-height:1.3}
.svc-page .sp-cal-c.hot{background:var(--navy);border-color:var(--navy)}
.svc-page .sp-cal-c.hot .mo{color:var(--or)}
.svc-page .sp-cal-c.hot .fo{color:#fff}

/* SIGNATURE: stage arc */
.svc-page .sp-arc{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0;background:#fff;border:1px solid var(--border);box-shadow:0 14px 34px -26px rgba(10,22,40,.5)}
.svc-page .sp-arc-s{padding:26px 22px;border-right:1px solid var(--border);position:relative}
.svc-page .sp-arc-s:last-child{border-right:0}
.svc-page .sp-arc-s .dot{width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--b);margin-bottom:16px}
.svc-page .sp-arc-s:last-child .dot{background:var(--or);border-color:var(--or)}
.svc-page .sp-arc-s h4{font-size:15px;font-weight:700;letter-spacing:.5px;margin-bottom:6px}
.svc-page .sp-arc-s p{font-size:12.5px;line-height:1.55}
.svc-page .sp-arc-bar{height:2px;background:linear-gradient(90deg,var(--b),var(--or));margin-top:-1px}

/* SIGNATURE: tile grid (coverage / benefits) */
.svc-page .sp-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border);box-shadow:0 14px 34px -26px rgba(10,22,40,.5)}
.svc-page .sp-tile{background:#fff;padding:24px 20px;min-height:120px;display:flex;flex-direction:column}
.svc-page .sp-tile .ic{color:var(--b);margin-bottom:12px}
.svc-page .sp-tile h4{font-size:15px;font-weight:700;letter-spacing:.5px;margin-bottom:6px}
.svc-page .sp-tile p{font-size:12.5px;line-height:1.5}

/* META STRIP */
.svc-page .sp-meta{display:grid;grid-template-columns:repeat(3,1fr);margin-top:52px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.svc-page .sp-meta > div{padding:28px 32px;border-right:1px solid var(--border)}
.svc-page .sp-meta > div:last-child{border-right:0}
.svc-page .sp-meta h5{font-family:var(--disp);font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--b);margin-bottom:10px}
.svc-page .sp-meta p{font-size:15px;color:var(--navy)}

/* COMPARE */
.svc-page .sp-compare{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--border);background:#fff}
.svc-page .sp-col{padding:36px 34px}
.svc-page .sp-col.a{border-right:1px solid var(--border);background:#fafcfe}
.svc-page .sp-col h4{font-size:17px;font-weight:700;letter-spacing:.5px;margin-bottom:4px}
.svc-page .sp-col .sub{font-size:13px;margin-bottom:24px}
.svc-page .sp-cr{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--border);font-size:14.5px}
.svc-page .sp-cr:last-child{border-bottom:0}
.svc-page .sp-col.a .sp-cr b{color:#93a9b4;font-weight:500}
.svc-page .sp-col.a .sp-cr i{font-style:normal;color:#b9c8d1;font-size:12.5px}
.svc-page .sp-col.b .sp-cr b{color:var(--navy);font-weight:600}
.svc-page .sp-col.b .sp-cr i{font-style:normal;color:var(--b);font-size:12.5px;font-weight:500}

/* PROCESS TRACK */
.svc-page .sp-track{margin-top:18px}
.svc-page .sp-steps{display:grid;gap:0}
.svc-page .sp-step{padding:0 22px 0 0;position:relative}
.svc-page .sp-step:before{content:"";position:absolute;top:8px;left:0;right:0;height:1px;background:var(--border)}
.svc-page .sp-step .dot{width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid var(--b);position:relative;z-index:2;margin-bottom:22px}
.svc-page .sp-step.last .dot{background:var(--or);border-color:var(--or)}
.svc-page .sp-step .num{font-family:var(--disp);font-size:11px;font-weight:700;letter-spacing:1.4px;color:var(--or);margin-bottom:7px}
.svc-page .sp-step h4{font-size:15.5px;font-weight:700;letter-spacing:.5px;margin-bottom:8px;line-height:1.3}
.svc-page .sp-step p{font-size:13px;line-height:1.55}

/* DARK */
.svc-page .sp-dark{background:var(--navy);color:rgba(255,255,255,.66);position:relative;overflow:hidden}
.svc-page .sp-dark:before{content:"";position:absolute;top:-120px;right:-120px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(0,146,175,.28),transparent 70%)}
.svc-page .sp-dark .sp-wrap{position:relative}
.svc-page .sp-dark h2{color:#fff}
.svc-page .sp-dark p{max-width:800px;font-size:17px}
.svc-page .sp-dark p+p{margin-top:18px}

/* PROMISE stat */
.svc-page .sp-promise{display:grid;grid-template-columns:auto 1fr;gap:52px;align-items:center}
.svc-page .sp-stat{font-family:var(--disp);font-size:clamp(110px,16vw,200px);font-weight:700;line-height:.82;color:var(--or);letter-spacing:-3px}
.svc-page .sp-stat small{display:block;font-family:var(--disp);font-size:12px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--b);margin-top:16px}
.svc-page .sp-promise h3{font-size:clamp(22px,2.6vw,32px);text-transform:uppercase;margin-bottom:14px;letter-spacing:.5px}

/* CROSSLINK */
.svc-page .sp-cross{border:1px solid var(--border);border-left:3px solid var(--b);padding:30px 36px;display:flex;justify-content:space-between;align-items:center;gap:30px;background:#fff}
.svc-page .sp-cross p{font-size:15.5px;max-width:720px}
.svc-page .sp-cross a{font-family:var(--disp);font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--b);text-decoration:none;white-space:nowrap}
.svc-page .sp-cross a:hover{color:var(--or)}

/* DISCLOSURE */
.svc-page .sp-disc{font-size:11.5px;color:var(--muted);line-height:1.85;border-top:1px solid var(--border);padding-top:22px;margin-top:44px;max-width:840px}

/* FINAL CTA */
.svc-page .sp-final{background:var(--bg);text-align:center}
.svc-page .sp-final h2{margin-bottom:30px}

/* reveal */
.svc-page .sp-reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.svc-page .sp-reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.svc-page .sp-reveal{opacity:1;transform:none;transition:none}}

@media(max-width:920px){
  .svc-page .sp-flow,.svc-page .sp-arc{grid-auto-flow:row;grid-auto-columns:auto}
  .svc-page .sp-flow-step,.svc-page .sp-arc-s{border-right:0;border-bottom:1px solid var(--border)}
  .svc-page .sp-tiles{grid-template-columns:repeat(2,1fr)}
  .svc-page .sp-cal{grid-template-columns:repeat(3,1fr)}
  .svc-page .sp-steps{grid-template-columns:repeat(2,1fr)!important;gap:30px 20px}
  .svc-page .sp-step:before{display:none}
  .svc-page .sp-meta,.svc-page .sp-promise{grid-template-columns:1fr;gap:24px}
}
@media(max-width:640px){
  .svc-page .sp-wrap{padding:0 22px}
  .svc-page section.sp-sec{padding:60px 0}
  .svc-page .sp-split,.svc-page .sp-compare{grid-template-columns:1fr}
  .svc-page .sp-col.a{border-right:0;border-bottom:1px solid var(--border)}
  .svc-page .sp-steps,.svc-page .sp-meta,.svc-page .sp-tiles,.svc-page .sp-cal{grid-template-columns:1fr!important}
  .svc-page .sp-meta > div{border-right:0;border-bottom:1px solid var(--border)}
  .svc-page .sp-cross{flex-direction:column;align-items:flex-start}
}