/* Service detail pages (scripts/site/pages/services.js), also loaded by the warehouse page.
   Flat surfaces only (scripts/site/DESIGN.md): no glows, frames, stripes or icon tiles. */

/* Hero: text left, the service illustration right, shown as a plain picture */
.svc-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:56px;align-items:center}
.svc-hero h1{max-width:760px}
.svc-hero .hero-actions{margin-top:28px}
.breadcrumb li[aria-current="page"]{color:#e6ecf1}
.svc-hero-img{display:block;width:320px;max-width:100%;height:auto;border-radius:10px}

/* Overview text + short definition list */
.svc-overview{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:64px;align-items:start}
.svc-overview .prose h2{margin-top:0}
.svc-overview .prose p{color:#38414b}
.svc-facts{background:var(--pale);border:1px solid var(--line);border-radius:10px;padding:22px 24px 10px}
.svc-facts h2{font-size:18px;letter-spacing:-.2px;margin:0 0 6px}
.svc-facts dl{margin:0}
.svc-facts dl div{display:grid;grid-template-columns:minmax(100px,36%) 1fr;gap:16px;padding:11px 0}
.svc-facts dl div+div{border-top:1px solid #dde3e8}
.svc-facts dt{font-size:14px;color:var(--muted)}
.svc-facts dd{margin:0;font-size:15px;font-weight:600;color:var(--ink)}

/* Scope: two-column rows, service name left, description right */
.svc-scope{margin:0;max-width:960px;border-top:1px solid #d9dfe5}
.svc-scope div{display:grid;grid-template-columns:minmax(180px,30%) 1fr;gap:24px;padding:18px 0;border-bottom:1px solid #d9dfe5}
.svc-scope dt{font-size:17px;font-weight:750;line-height:1.35;color:var(--ink)}
.svc-scope dd{margin:0;font-size:15px;color:#38414b;line-height:1.6}

/* Process: heading left, ordered list right; numbers are ordinary list markers */
.svc-process{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:64px;align-items:start}
.svc-process h2{margin-top:0}
.svc-process>div p{margin:0;color:var(--muted);font-size:16px}
.svc-steps{margin:0;padding-left:1.4em;display:grid;gap:18px}
.svc-steps li{font-size:15px;color:#38414b;line-height:1.6;padding-left:6px}
.svc-steps li::marker{font-weight:750;color:var(--ink)}
.svc-steps strong{display:block;font-size:17px;color:var(--ink);margin-bottom:2px}

/* Use cases: plain two-column bullet list */
.svc-uses{margin:0;padding-left:1.2em;columns:2;column-gap:56px;max-width:980px}
.svc-uses li{break-inside:avoid;margin:0 0 12px;font-size:15px;color:#38414b;line-height:1.55}
.svc-uses li::marker{color:var(--orange)}
.svc-uses strong{color:var(--ink)}

/* Related services: compact link list */
.svc-related-section{padding:48px 0 56px;border-top:1px solid var(--line)}
.svc-related-section h2{font-size:22px;letter-spacing:-.3px;margin:0 0 18px}
.svc-related{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px 40px}
.svc-related a{font-weight:700;font-size:15px;color:var(--navy);text-decoration:underline;text-decoration-color:#c9d1d8;text-underline-offset:3px}
.svc-related a:hover{color:var(--orange-text);text-decoration-color:currentColor}
.svc-related span{display:block;margin-top:3px;font-size:14px;color:var(--muted);line-height:1.5}

/* Quote form (scripts/site/quote-form.js): intro + contact list left, form right */
.svc-quote{background:#fff;border-top:1px solid var(--line)}
.svc-quote.section-alt{background:var(--pale);border-top:0}
.svc-quote .quote-info h2{margin-top:0}
.svc-quote .quote-info p{font-size:16px;line-height:1.6}
.svc-quote-contact{margin:24px 0 0}
.svc-quote-contact div{padding:12px 0;border-top:1px solid var(--line)}
.svc-quote-contact dt{font-size:12px;font-weight:650;color:var(--muted)}
.svc-quote-contact dd{margin:2px 0 0;font-size:15px;font-weight:600;color:var(--ink)}
.svc-quote-contact a{color:var(--orange-text);text-decoration:underline;text-underline-offset:3px}
.svc-quote-contact a:hover{color:var(--orange-dark)}
.svc-quote .formbox legend{font-size:15px;color:var(--navy);margin:8px 0 12px}
.svc-quote .formbox fieldset+fieldset{margin-top:14px}
.svc-quote .req{color:var(--orange-text)}
.svc-quote-count{grid-template-columns:minmax(0,1fr) minmax(0,130px)}
@media (min-width:981px){.svc-quote .quote-info{position:sticky;top:110px}}

@media (max-width:980px){
  .svc-hero-img{width:260px}
  .svc-overview,.svc-process{gap:40px}
}
@media (max-width:850px){
  .svc-hero-grid{grid-template-columns:1fr;gap:28px}
  .svc-hero-img{width:240px}
  .svc-overview,.svc-process{grid-template-columns:1fr;gap:28px}
  .svc-uses{columns:1}
}
@media (max-width:540px){
  .page-hero.svc-hero{padding:40px 0 36px}
  .svc-hero h1{font-size:30px;letter-spacing:-.2px}
  .svc-hero p{font-size:15px}
  .svc-hero .hero-actions .btn{width:100%}
  .svc-hero-art{display:none}
  .svc-facts dl div{grid-template-columns:1fr;gap:2px}
  .svc-scope div{grid-template-columns:1fr;gap:4px;padding:14px 0}
  .svc-scope dt{font-size:16px}
  .svc-related-section{padding:36px 0 44px}
}