/* ==========================================================
   SERVICES HERO BANNER  (/services/)
   ========================================================== */
.ld-services-hero{background:#f3f9fc;padding:24px 0 40px}
.ld-services-hero-card{position:relative;border-radius:32px;overflow:hidden;min-height:380px;display:flex;align-items:center;justify-content:center}
.ld-services-hero-bg{position:absolute;inset:0}
.ld-services-hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,58,82,.55) 0%,rgba(6,58,82,.72) 100%)}
.ld-services-hero-content{position:relative;z-index:1;text-align:center;max-width:760px;padding:40px 32px}
.ld-services-hero-h1{font-family:"Quicksand",sans-serif;font-size:56px;line-height:1.1;font-weight:600;letter-spacing:-1px;color:#fff}
.ld-services-hero-crumb{margin-top:28px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:13px;letter-spacing:2px;font-weight:700;text-transform:uppercase;color:rgba(255,255,255,.75)}
.ld-services-hero-crumb a{color:rgba(255,255,255,.75)}
.ld-services-hero-crumb a:hover{color:#bbdbf2}
.ld-services-hero-desc{margin-top:24px;font-size:15px;line-height:1.7;color:rgba(255,255,255,.85)}

/* ==========================================================
   SERVICES
   ========================================================== */
/* Full-bleed band so this section reads as a distinct step in the page
   rhythm (why-trust navy -> services pale -> pricing white -> testimonials
   pale), instead of blending into the plain-white sections on both sides. */
.ld-svc-band{background:#f3f9fc}
.ld-sec--services{padding:90px 32px}
.ld-display{font-size:96px;font-weight:300;color:#063a52;letter-spacing:-3px;line-height:1;text-align:center}
.ld-head--services{margin-top:36px;margin-bottom:36px}
.ld-svc-heading{font-size:26px;font-weight:600;color:#063a52;line-height:1.2}
.ld-head-right--svc{gap:28px}
.ld-head-right--svc .ld-head-desc{max-width:360px;white-space:nowrap}
.ld-svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
/* Real surface, not a bare bounding box: the lift+shadow on hover
   (style.css) needs a filled card with even padding to cast from, or the
   shadow hugs the image edge and cuts off at the link baseline.
   Border/fill/radius follow .ld-svcd on /services/. */
.ld-svc-card{padding:12px;border:1px solid #e4ebef;border-radius:20px;background:#fff;overflow:hidden}
.ld-svc-media{height:200px;border-radius:12px;overflow:hidden}
.ld-svc-body{padding:16px 6px 6px}
.ld-svc-title{font-weight:700;font-size:17px;color:#063a52;margin-bottom:8px}
.ld-svc-desc{font-size:13px;line-height:1.6;color:#758c97;margin-bottom:12px}
.ld-svc-link{font-size:13px;font-weight:600;color:#0078ad;display:inline-flex;align-items:center;gap:6px}
.ld-svc-arrow{font-size:14px}

/* Services the homepage grid doesn't card, named as links so the doc's full
   home list stays visible rather than hiding behind "Explore All". */
.ld-svc-more{margin-top:40px;display:flex;align-items:baseline;flex-wrap:wrap;gap:10px 14px}
.ld-svc-more-label{font-size:13px;font-weight:700;color:#063a52;flex-shrink:0}
.ld-svc-more-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none}
.ld-svc-chip{display:inline-block;padding:8px 16px;border:1px solid #e4ebef;border-radius:100px;background:#f4f7f9;font-size:13px;font-weight:500;color:#3f5660;transition:border-color .18s ease,color .18s ease,background .18s ease}
.ld-svc-chip:hover{border-color:#0078ad;background:#e7f4fc;color:#0078ad}
.ld-svc-close{margin-top:32px;font-size:15px;font-weight:500;color:#063a52;text-align:center}

/* ==========================================================
   SERVICE DETAIL (/services/)
   ========================================================== */
.ld-sec--svcd{padding-top:56px}
.ld-svcd-jump{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:56px}
.ld-svcd-jump-link{display:inline-block;padding:8px 16px;border:1px solid #e4ebef;border-radius:100px;background:#f4f7f9;font-size:13px;font-weight:500;color:#3f5660;transition:border-color .18s ease,color .18s ease,background .18s ease}
.ld-svcd-jump-link:hover{border-color:#0078ad;background:#e7f4fc;color:#0078ad}

.ld-svcd-list{display:flex;flex-direction:column;gap:28px}
.ld-svcd{display:grid;grid-template-columns:300px minmax(0,1fr);gap:32px;padding:28px;border:1px solid #e4ebef;border-radius:24px;background:#fff;transition:box-shadow .18s ease}
.ld-svcd:hover{box-shadow:0 16px 40px rgba(16,31,77,.10)}
.ld-svcd-media{height:100%;min-height:240px;border-radius:16px;overflow:hidden;background:#f4f7f9}
/* Grid item: without min-width:0 the nested .ld-svcd-cols grid floors at its
   content's min-content width and pushes the card wider than its track. */
.ld-svcd-body{min-width:0}
.ld-svcd-title{font-size:26px;font-weight:600;line-height:1.15;color:#063a52;letter-spacing:-.3px}
.ld-svcd-tagline{margin-top:8px;font-size:14px;font-weight:600;font-style:italic;color:#0078ad}
.ld-svcd-toggle{display:none;align-items:center;gap:6px;margin-top:14px;padding:10px 18px;border:1px solid #0078ad;border-radius:100px;background:#e7f4fc;color:#0078ad;font-size:13px;font-weight:600;cursor:pointer}
.ld-svcd-toggle-icon{font-size:14px;transition:transform .2s ease}
.ld-svcd-toggle[aria-expanded="true"] .ld-svcd-toggle-icon{transform:rotate(180deg)}
.ld-svcd-desc{margin-top:14px;font-size:14px;line-height:1.65;color:#758c97}
.ld-svcd-cols{margin-top:24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:24px}
.ld-svcd-col-label{font-size:11px;letter-spacing:1.5px;font-weight:700;color:#063a52;margin-bottom:12px}
.ld-svcd-items{list-style:none;display:flex;flex-direction:column;gap:8px}
.ld-svcd-item{display:flex;align-items:flex-start;gap:9px;font-size:13px;line-height:1.5;color:#3f5660}
.ld-svcd-dot{width:5px;height:5px;margin-top:7px;border-radius:50%;background:#bbdbf2;flex-shrink:0}
.ld-svcd-check{width:18px;height:18px;border-radius:50%;background:#e7f4fc;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ld-svcd-item--benefit{font-weight:500;color:#063a52}
.ld-svcd-note{margin-top:22px;padding:12px 16px;border-left:3px solid #bbdbf2;border-radius:0 8px 8px 0;background:#f4f7f9;font-size:12px;line-height:1.6;color:#758c97}

/* ==========================================================
   SERVICE POLICIES
   ========================================================== */
.ld-policies{background:#063a52;padding:76px 0;margin-bottom:80px}
.ld-policies-head{margin-bottom:40px}
.ld-policies-eyebrow{font-size:11px;letter-spacing:2px;color:#bbdbf2;font-weight:700;margin-bottom:14px}
.ld-policies-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ld-policy{background:#00557a;border-radius:18px;padding:26px 22px;border:1px solid rgba(255,255,255,.06)}
.ld-policy-title{font-weight:700;font-size:16px;color:#fff;margin-bottom:10px}
.ld-policy-desc{font-size:13px;line-height:1.65;color:rgba(255,255,255,.6)}

/* ==========================================================
   RESPONSIVE
   Additive only — mirrors the breakpoint stops in style.css.
   Stops: 1024 / 900 / 620 / 560
   ========================================================== */

@media (max-width:1024px){
  .ld-services-hero-card{min-height:340px}
  .ld-services-hero-h1{font-size:44px}
  .ld-display{font-size:74px;letter-spacing:-2px}
  /* Below this the 300px media rail leaves too little for the two list
     columns beside it — stack the image above the copy instead. */
  .ld-svcd{grid-template-columns:minmax(0,1fr);gap:24px}
  .ld-svcd-media{min-height:0;height:220px}
  .ld-policies-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:900px){
  .ld-display{font-size:64px}
  .ld-svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ld-head-right--svc .ld-head-desc{max-width:280px;white-space:normal}
}

@media (max-width:620px){
  .ld-services-hero-card{min-height:300px;border-radius:22px}
  .ld-services-hero-content{padding:32px 24px}
  .ld-services-hero-h1{font-size:32px}
  .ld-services-hero-crumb{font-size:11px}
  .ld-services-hero-desc{font-size:14px}
  .ld-display{font-size:54px;letter-spacing:-1.5px}
  .ld-svcd{padding:20px;border-radius:18px}
  .ld-svcd-title{font-size:22px}
  .ld-svcd-toggle{display:inline-flex}
  .ld-svcd-extra{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}
  .ld-svcd-extra.is-open{grid-template-rows:1fr}
  .ld-svcd-extra-inner{overflow:hidden}
  .ld-svcd-cols{grid-template-columns:minmax(0,1fr);gap:20px}
  .ld-policies{padding:52px 0;margin-bottom:56px}
  .ld-policies-grid{grid-template-columns:minmax(0,1fr);gap:12px}
  .ld-svc-more{margin-top:32px}
  .ld-svc-close{font-size:14px;text-align:left}
}

@media (max-width:560px){
  /* clamp keeps the signature display type dominant and self-protects
     below 390px. Holds roughly the desktop 96/58 display-to-h1 ratio. */
  .ld-display{font-size:clamp(38px,12vw,50px);letter-spacing:-1px}
  /* 6 services 2-up at 390px would give ~164px cards; go single here. */
  .ld-svc-grid{grid-template-columns:minmax(0,1fr);gap:26px}
  .ld-sec--svcd{padding-top:40px}
  /* 12 jump links wrap to a tall block on a phone; scroll them sideways
     in one row instead of pushing the first service below the fold. */
  .ld-svcd-jump{flex-wrap:nowrap;overflow-x:auto;margin-bottom:36px;padding-bottom:6px;-webkit-overflow-scrolling:touch}
  .ld-svcd-jump-link{flex-shrink:0}
}