/* Products & Services page — extends home.css */
.page-hero { min-height: 470px; position: relative; overflow: hidden; display: flex; align-items: flex-end; color: #fff; background: var(--navy-950); }
.page-hero-media, .page-hero-shade { position: absolute; inset: 0; }
.page-hero-media { background: url("../../images/home/industry-general-services.webp") center / cover no-repeat; filter: saturate(.6); }
.page-hero-shade { background: linear-gradient(90deg, rgba(1,18,33,.95) 0%, rgba(3,24,42,.8) 45%, rgba(2,17,31,.45) 100%); }
.page-hero-content { position: relative; z-index: 2; padding: 150px 0 64px; }
.page-hero h1 { margin: 0; font-family: var(--serif); font-size: clamp(50px, 5.4vw, 82px); font-weight: 600; line-height: .92; letter-spacing: -.035em; text-transform: uppercase; }
.page-hero h1 em { color: #9dccff; font-style: normal; }
.page-hero-summary { max-width: 560px; margin: 26px 0 0; color: rgba(255,255,255,.8); font-size: 14px; line-height: 1.7; }
.breadcrumb { margin: 0 0 26px; display: flex; gap: 10px; color: rgba(255,255,255,.55); font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.breadcrumb a:hover { color: #fff; }

.services { padding: 80px 0 100px; }
.services-intro { margin-bottom: 40px; }

.category-nav { position: sticky; z-index: 20; top: 86px; border-bottom: 1px solid var(--line); background: #fff; }
.category-nav .page-shell { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.category-nav .page-shell::-webkit-scrollbar { display: none; }
.category-nav a { flex: 0 0 auto; padding: 19px 16px; position: relative; color: var(--muted); font-size: 11px; font-weight: 700; text-transform: uppercase; white-space: nowrap; transition: color .2s ease; }
.category-nav a::after { content: ""; position: absolute; left: 16px; right: 16px; bottom: -1px; height: 2px; background: var(--blue); transform: scaleX(0); transition: transform .25s ease; }
.category-nav a:hover, .category-nav a:focus-visible { color: var(--blue); }
.category-nav a:hover::after, .category-nav a:focus-visible::after { transform: scaleX(1); }

.service-group { padding: 46px 0; display: grid; grid-template-columns: minmax(0, 34fr) minmax(0, 66fr); gap: 40px; border-top: 1px solid var(--line); scroll-margin-top: 150px; }
.service-group:last-child { border-bottom: 1px solid var(--line); }
.group-head { align-self: start; position: sticky; top: 170px; }
.group-number { margin: 0 0 18px; color: var(--blue); font-family: var(--serif); font-size: 46px; font-weight: 500; line-height: 1; }
.group-head h2 { margin: 0; font-family: var(--serif); font-size: clamp(30px, 2.6vw, 40px); font-weight: 600; line-height: .95; letter-spacing: -.02em; text-transform: uppercase; }
.group-head p:last-child { max-width: 320px; margin: 16px 0 0; color: var(--muted); font-size: 13px; line-height: 1.65; }

/* Cards: every card in a group has the same height; price row is pinned to the bottom */
.service-list { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; gap: 12px; }
.service-item { min-height: 150px; padding: 20px 22px 0; position: relative; display: flex; flex-direction: column; border: 1px solid #dce3ea; background: #fff; transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease; }
.service-item:hover { border-color: var(--blue); box-shadow: 0 14px 30px rgba(16,34,58,.09); transform: translateY(-3px); }
.service-item h3 { margin: 0 0 18px; padding-right: 30px; color: var(--ink); font-size: 13px; font-weight: 700; line-height: 1.55; }
.item-no { position: absolute; top: 21px; right: 20px; color: #9aa8b8; font-size: 10px; font-weight: 800; }
.service-price { height: 64px; margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #edf1f4; }
.service-price .price { color: var(--blue); font-family: var(--sans); font-size: 22px; font-weight: 800; line-height: 1; letter-spacing: -.01em; font-variant-numeric: lining-nums tabular-nums; white-space: nowrap; }
.service-price .price small { margin-right: 3px; font-size: 10px; font-weight: 800; letter-spacing: .06em; vertical-align: 3px; }
.service-price .period { padding: 6px 10px; color: #46607e; background: #eef3f8; font-size: 9px; font-style: normal; font-weight: 800; letter-spacing: .06em; line-height: 1; text-transform: uppercase; white-space: nowrap; }
.service-price .period:empty { padding: 0; background: none; }

@media (max-width: 980px) {
  .service-group { grid-template-columns: 1fr; gap: 26px; }
  .group-head { position: static; }
}

@media (max-width: 640px) {
  .category-nav { top: 72px; }
  .service-group { padding: 36px 0; scroll-margin-top: 130px; }
  .service-list { grid-template-columns: 1fr; grid-auto-rows: auto; }
  .service-item { min-height: 0; }
  .page-hero { min-height: 420px; }
  .page-hero-content { padding: 120px 0 48px; }
  .services { padding: 56px 0 70px; }
}