/* ═══════════ SERVICES PAGES ═══════════ */

/* Services Index */
.svc-hero {
  padding: 160px var(--pad) 120px;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.svc-hero__orbit {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
.svc-hero__orbit img {
  position: absolute;
  opacity: .1;
  filter: brightness(0) invert(1);
}
.svc-hero__orbit img.a { top: -20%; right: -10%; width: 55%; animation: spin 180s linear infinite; }
.svc-hero__orbit img.b { bottom: -10%; left: -8%; width: 40%; animation: spin 140s linear infinite reverse; }

.svc-hero__eyebrow {
  font-family: var(--f-mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .24em;
  color: var(--orange);
  margin-bottom: 32px;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  position: relative; z-index: 2;
}
.svc-hero__eyebrow::before { content:""; width:36px; height:1px; background:currentColor; }
.svc-hero__title {
  font-family: var(--f-display);
  font-weight: 300;
  font-size: clamp(56px, 10vw, 168px);
  line-height: .9;
  letter-spacing: -0.03em;
  color: var(--paper);
  position: relative; z-index: 2;
}
.svc-hero__title .em { color: var(--orange); font-style: normal; }
.svc-hero__title .row--indent { padding-left: 14%; }
.svc-hero__lede {
  position: relative; z-index: 2;
  margin-top: 48px;
  max-width: 640px;
  font-size: 18px;
  line-height: 1.55;
  color: #cfd8dc;
}

/* Services table — big rows, shape on hover */
.svc-list {
  padding: 0 var(--pad) 120px;
  position: relative;
  z-index: 2;
}
.svc-row {
  display: grid;
  grid-template-columns: 80px 1fr 1fr 120px;
  gap: 32px;
  padding: 48px 0;
  border-top: 1px solid rgba(255,255,255,.15);
  align-items: center;
  position: relative;
  cursor: pointer;
  transition: padding .4s var(--e-out);
  color: inherit;
  text-decoration: none;
}
.svc-row:last-child { border-bottom: 1px solid rgba(255,255,255,.15); }
.svc-row:hover { padding-left: 16px; }
.svc-row:hover .svc-row__preview { opacity: 1; transform: translateX(0) rotate(12deg); }
.svc-row:hover .svc-row__name { color: var(--orange); }
.svc-row:hover .svc-row__arrow { background: var(--orange); border-color: var(--orange); transform: rotate(-45deg); }

.svc-row__num {
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: .22em;
  color: var(--orange);
}
.svc-row__name {
  font-family: var(--f-display);
  font-size: clamp(40px, 5vw, 80px);
  line-height: .95;
  font-weight: 300;
  letter-spacing: -0.02em;
  color: var(--paper);
  transition: color .3s;
}
.svc-row__desc {
  font-size: 15px;
  line-height: 1.55;
  color: #9fb0b5;
  max-width: 400px;
}
.svc-row__preview {
  width: 100px; height: 100px;
  opacity: 0;
  transform: translateX(-20px) rotate(0);
  transition: opacity .5s var(--e-out), transform .5s var(--e-out);
  justify-self: end;
  margin-right: -10px;
}
.svc-row__preview img { width: 100%; height: 100%; object-fit: contain; }
.svc-row__arrow {
  width: 48px; height: 48px;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--paper);
  transition: background .3s, border-color .3s, transform .3s var(--e-out);
  justify-self: end;
}
.svc-row__arrow svg { width: 18px; height: 18px; }
@media (max-width: 900px) {
  .svc-row { grid-template-columns: 60px 1fr 60px; }
  .svc-row__desc { grid-column: 1 / -1; margin-top: 8px; }
  .svc-row__preview { display: none; }
}

/* Capabilities band (light) */
.caps {
  padding: 140px var(--pad);
}
.caps__head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin-bottom: 60px;
  align-items: end;
}
.caps__title {
  font-family: var(--f-display);
  font-size: clamp(40px, 6vw, 88px);
  line-height: .92;
  font-weight: 300;
  letter-spacing: -0.03em;
}
.caps__title .em { color: var(--orange); font-style: normal; }
.caps__right {
  max-width: 440px;
  justify-self: end;
  font-size: 16px;
  color: var(--subtle);
  line-height: 1.55;
}
.caps__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid var(--ink);
}
.cap {
  padding: 28px 28px 28px 0;
  border-bottom: 1px solid var(--rule-light);
  border-right: 1px solid var(--rule-light);
  font-size: 14.5px;
  color: var(--ink);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cap:nth-child(4n) { border-right: 0; padding-right: 0; }
.cap__name {
  font-family: var(--f-display);
  font-size: 19px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.cap__desc { color: var(--subtle); font-size: 13.5px; line-height: 1.5; }
@media (max-width: 900px) {
  .caps__head { grid-template-columns: 1fr; }
  .caps__right { justify-self: start; }
  .caps__grid { grid-template-columns: 1fr 1fr; }
  .cap, .cap:nth-child(4n) { border-right: 0; padding-right: 0; }
}
@media (max-width: 560px) { .caps__grid { grid-template-columns: 1fr; } }

/* ─── SERVICE DETAIL PAGE ─── */
.svc-d-hero {
  padding: 160px var(--pad) 100px;
  position: relative;
  overflow: hidden;
  min-height: 80vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  isolation: isolate;
}
.svc-d-hero__bg-shape {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .12;
  z-index: 0;
  pointer-events: none;
}
.svc-d-hero__bg-shape img { width: 100%; height: 100%; object-fit: cover; }

.svc-d-hero__nav-row {
  display: flex;
  justify-content: space-between;
  font-family: var(--f-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .22em;
  color: var(--grey-blue);
  margin-bottom: 60px;
  position: relative; z-index: 2;
}
.svc-d-hero__nav-row a { color: inherit; text-decoration: none; }
.svc-d-hero__nav-row a:hover { color: var(--orange); }
.svc-d-hero__nav-row .num { color: var(--orange); }

.svc-d-hero__kicker {
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--orange);
  margin-bottom: 28px;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  position: relative; z-index: 2;
}
.svc-d-hero__kicker::before { content:""; width:36px; height:1px; background:currentColor; }

.svc-d-hero__title {
  font-family: var(--f-display);
  font-weight: 300;
  font-size: clamp(64px, 13vw, 220px);
  line-height: .85;
  letter-spacing: -0.04em;
  color: var(--paper);
  position: relative; z-index: 2;
}
.svc-d-hero__title .em { color: var(--orange); font-style: normal; }

.svc-d-hero__lede {
  margin-top: 48px;
  max-width: 640px;
  font-size: 18px;
  line-height: 1.6;
  color: #cfd8dc;
  position: relative; z-index: 2;
}

/* Offer grid */
.offer {
  padding: 140px var(--pad);
}
.offer__head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin-bottom: 60px;
  align-items: end;
}
.offer__title {
  font-family: var(--f-display);
  font-size: clamp(40px, 6vw, 88px);
  line-height: .9;
  font-weight: 300;
  letter-spacing: -0.03em;
}
.offer__title .em { color: var(--orange); font-style: normal; }
.offer__right {
  max-width: 440px;
  justify-self: end;
  font-size: 16px;
  color: var(--subtle);
  line-height: 1.55;
}
.offer__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.offer-card {
  padding: 36px 28px;
  border: 1px solid var(--rule-light);
  background: var(--paper);
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
  transition: border-color .3s, transform .3s var(--e-out);
}
.offer-card:hover { border-color: var(--orange); transform: translateY(-4px); }
.offer-card__num {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: .22em;
  color: var(--orange);
}
.offer-card__name {
  font-family: var(--f-display);
  font-size: 28px;
  line-height: 1;
  letter-spacing: -0.01em;
  font-weight: 400;
}
.offer-card__desc { font-size: 14.5px; line-height: 1.55; color: var(--subtle); }
@media (max-width: 900px) {
  .offer__head { grid-template-columns: 1fr; }
  .offer__right { justify-self: start; }
  .offer__grid { grid-template-columns: 1fr; }
}

/* Proof (dark, number + quote) */
.proof {
  padding: 140px var(--pad);
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 80px;
  align-items: center;
}
.proof__num {
  font-family: var(--f-display);
  font-size: clamp(120px, 18vw, 280px);
  line-height: .82;
  font-weight: 200;
  letter-spacing: -0.05em;
  color: var(--orange);
}
.proof__num .unit { color: var(--paper); }
.proof__label {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--grey-blue);
  margin-bottom: 20px;
}
.proof__text {
  font-family: var(--f-display);
  font-size: clamp(24px, 2.8vw, 40px);
  line-height: 1.15;
  font-weight: 300;
  letter-spacing: -0.01em;
  color: var(--paper);
  margin-bottom: 30px;
}
.proof__text .em { color: var(--orange); font-style: normal; }
.proof__cite {
  font-family: var(--f-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .22em;
  color: var(--grey-blue);
}
.proof__cite strong { color: var(--paper); font-weight: 500; }
@media (max-width: 900px) {
  .proof { grid-template-columns: 1fr; gap: 40px; }
}

/* Next service nav */
.next-svc {
  padding: 100px var(--pad);
  border-top: 1px solid var(--rule-light);
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 40px;
  align-items: end;
}
.next-svc__label {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--subtle);
  margin-bottom: 20px;
}
.next-svc__link {
  font-family: var(--f-display);
  font-size: clamp(40px, 6vw, 96px);
  line-height: .95;
  font-weight: 300;
  letter-spacing: -0.03em;
  color: var(--ink);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 28px;
  transition: color .3s, gap .3s var(--e-out);
}
.next-svc__link:hover { color: var(--orange); gap: 44px; }
.next-svc__link svg { width: 60px; height: 60px; flex-shrink: 0; }
.next-svc__img {
  justify-self: end;
  width: 280px;
  height: 180px;
  overflow: hidden;
  position: relative;
}
.next-svc__img img { width: 100%; height: 100%; object-fit: contain; opacity: .8; animation: spin 30s linear infinite; }
@media (max-width: 780px) {
  .next-svc { grid-template-columns: 1fr; }
  .next-svc__img { display: none; }
}