/* Figma 88:247 and 104:188. Scope to the existing capability breadcrumb so
 * unrelated page families retain their previews. Saved blocks are untouched. */
:is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) {
  --capability-surface: #151c29;
}
:is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .inner-hero {
  background: #030407;
  padding-top: 13.5vw;
  padding-bottom: 6vw;
}
:is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .inner-hero-art {
  mask-image: url(reference-hub-mask.svg);
}
:is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .discovery-hero .inner-hero-art {
  mask-image: url(reference-service-mask.svg);
}
/* Counter-rotate the photography, not the exported seven-shaped mask. */
:is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .inner-hero-art img {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 195%;
  max-width: none;
  height: 106%;
  object-fit: cover;
  transform: translate(-50%,-50%) rotate(-90deg);
}
:is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .inner-breadcrumb { margin-bottom: 25px; }
:is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .inner-lead { line-height: var(--int-paragraph-line-height,var(--int-body-line-height,1.5)); }
.hub-routes { background: var(--capability-surface,#151c29); padding-top: 90px; }
.hub-route-group { margin-top: 10px; }
.hub-route-group details { background: #e1ebed14; }
.hub-route-group summary {
  position: relative;
  list-style: none;
  padding: 42px 105px 42px 50px;
  min-height: 125px;
  font-size: var(--int-heading-font-size,30px);
  font-weight: var(--int-heading-font-weight,400);
  color: white;
}
.hub-route-group summary::-webkit-details-marker,.faq-copy summary::-webkit-details-marker { display: none; }
.hub-route-group summary::after,.faq-copy summary::after {
  content: '';
  position: absolute;
  right: 40px;
  top: calc(50% - 6px);
  width: 20px;
  height: 12px;
  background: var(--int-lilac);
  mask: url(reference-disclosure.svg) center/contain no-repeat;
}
.hub-route-group details[open] > summary::after,.faq-copy details[open] > summary::after { transform: rotate(180deg); }
.hub-route-group summary:focus-visible,.faq-copy summary:focus-visible { outline: 2px solid var(--int-lilac); outline-offset: -4px; }
.route-intro { color: var(--int-lilac); }
.route-item { padding-top: 30px; padding-bottom: 30px; }
.route-ready { padding: 35px; }
:is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .discovery-detail {
  grid-template-columns: minmax(0,1.15fr) 120px minmax(0,1fr);
  padding: 130px 13.4%;
  gap: 55px;
}
:is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .detail-body p {
  font-size: var(--int-paragraph-font-size,var(--int-body-font-size,18px));
}
:is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .discovery-faq { padding-top: 160px; padding-bottom: 160px; }
.faq-copy details { background: #333a47; margin: 10px 0; }
.faq-copy summary { position: relative; list-style: none; padding: 27px 70px 27px 30px; min-height: 80px; }
.faq-copy summary::after { right: 30px; }
@media(max-width:1100px) {
  :is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .inner-hero { padding-top: 175px; padding-bottom: 90px; }
  :is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .discovery-detail { padding: 90px 7%; gap: 30px; grid-template-columns: minmax(0,1fr) 65px minmax(0,1fr); }
}
@media(max-width:780px) {
  :is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .inner-hero { padding-top: 150px; padding-bottom: 80px; }
  :is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .discovery-detail { grid-template-columns: minmax(0,1fr); padding: 75px 25px; gap: 20px; }
  :is(.service-content,.editor-styles-wrapper):has(.inner-breadcrumb a[href="/what-we-build/"], .v2-hub) .discovery-faq { padding: 80px 25px; }
  .hub-routes { padding-top: 55px; }
  .hub-route-group summary { padding: 28px 65px 28px 25px; min-height: 100px; font-size: var(--int-heading-font-size,26px); }
  .hub-route-group summary::after { right: 25px; }
  .route-ready { padding: 20px; }
}

/* Service hero 104:189/104:323. The exported mask is in its unrotated
 * coordinate space: rotate it anticlockwise and counter-rotate the photograph.
 * Keep this scoped to v2 capabilities; the accepted hub is a different mask. */
:is(.service-content,.editor-styles-wrapper) .v2-page.v2-capability .inner-hero.discovery-hero {
  background:#030407 url(figma-surface-glow.svg) center -5.9375vw/100vw 100vw no-repeat;
}
/* The old non-home fallback is needed on plain/light templates, but clips
 * the service hero. Explicit native block background choices remain intact. */
body:has(.service-content .v2-capability) .site-header:not(.has-background) { background-color:transparent; }
.v2-capability .inner-hero::after {
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:url(figma-surface-texture.webp) center -2.8125vw/130.01vw 62.3074vw no-repeat;
  mix-blend-mode:multiply;
}
.v2-capability .inner-hero-copy { position:relative; z-index:1; }
.v2-capability .inner-hero-copy > p:not(.eyebrow):not(.inner-breadcrumb):not(.closing-link) {
  max-width:560px; line-height:var(--int-paragraph-line-height,var(--int-body-line-height,1.5));
}
:is(.service-content,.editor-styles-wrapper) .v2-page.v2-capability .inner-hero .inner-hero-art {
  left:31.6875vw; top:-10.1875vw; width:78.50625vw; height:58.125vw;
  transform:rotate(-90deg);
  mask:url(reference-service-mask.svg) center/100% 100% no-repeat;
  opacity:1;
}
:is(.service-content,.editor-styles-wrapper) .v2-page.v2-capability .inner-hero .inner-hero-art img {
  left:calc(50% - 9.625vw); top:calc(50% + 13.8125vw);
  width:105.25vw; height:59.1875vw; max-width:none;
  transform:translate(-50%,-50%) rotate(90deg);
  object-fit:cover; object-position:center;
}
@media(max-width:780px) {
  .v2-capability .inner-hero::after { background-size:auto 100%; background-position:center; }
  :is(.service-content,.editor-styles-wrapper) .v2-page.v2-capability .inner-hero .inner-hero-art {
    left:60px; top:-180px; width:900px; height:666px; opacity:.35;
  }
  :is(.service-content,.editor-styles-wrapper) .v2-page.v2-capability .inner-hero .inner-hero-art img {
    left:calc(50% - 110px); top:calc(50% + 158px); width:1206px; height:679px;
  }
}