/* SX AGENCY / SERVICES — 2026 cinematic centred hero. Scoped; no changes to shared components. */
body.sx-services-reimagined .sxs-hero {
  height: 655px;
  min-height: 655px;
  overflow: hidden;
  isolation: isolate;
  background: #020304;
}
body.sx-services-reimagined .sxs-hero-art {
  position: absolute;
  inset: 0;
  background: url('assets/services-centred-scenery.webp') center top / 100% 100% no-repeat;
  filter: none;
  z-index: -3;
}
body.sx-services-reimagined .sxs-space-shade {
  background: linear-gradient(to bottom,rgba(1,2,4,.02) 0%, rgba(1,2,4,.05) 59%, rgba(1,2,4,.12) 100%);
  z-index: -2;
}
body.sx-services-reimagined .sxs-nebula-detail {display:none}
body.sx-services-reimagined .sxs-hero-inner {
  display:block;
  height:100%;
  position:relative;
  margin-inline:auto;
}
body.sx-services-reimagined .sxs-hero-copy {
  position: absolute;
  z-index: 3;
  top: 192px;
  left: 50%;
  right: auto;
  width: min(790px,calc(100vw - 42px));
  max-width: 790px;
  transform: translateX(-50%);
  text-align: center;
}
body.sx-services-reimagined .sxs-eyebrow {
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 18px;
  color: #eceef4;
  font-size:11px;
  letter-spacing:.28em;
  line-height:16px;
  font-weight:650;
}
body.sx-services-reimagined .sxs-eyebrow .sxs-line {
  display:block;
  width: 40px;
  height:1px;
  flex:0 0 40px;
  background:linear-gradient(90deg,transparent,#d4dae4 65%,#aeb7c6);
  opacity:.85;
}
body.sx-services-reimagined .sxs-eyebrow .sxs-line:last-child {
  background:linear-gradient(90deg,#aeb7c6 0%,#d4dae4 35%,transparent);
}
body.sx-services-reimagined .sxs-hero-copy h1 {
  font-family:'Manrope','DM Sans',Arial,sans-serif;
  font-size:clamp(49px,4.0vw,66px);
  font-weight:750;
  line-height:1.085;
  letter-spacing:-.059em;
  white-space:normal;
  margin:23px 0 18px;
  color:#f7f8fb;
}
body.sx-services-reimagined .sxs-hero-copy h1 span {
  background:linear-gradient(112deg,#c1c4ce 0%,#9a9ca9 75%,#c5c8d0 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
body.sx-services-reimagined .sxs-hero-copy>p {
  font-size:clamp(16px,1.13vw,19px);
  line-height:1.42;
  font-weight:400;
  letter-spacing:-.015em;
  color:#e0e1e6;
  max-width:495px;
  margin:0 auto;
  text-align:center;
  text-wrap:balance;
}
body.sx-services-reimagined .sxs-hero-actions {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:22px;
  flex-wrap:wrap;
  margin-top:25px;
}
body.sx-services-reimagined .sxs-hero-actions .sxs-pill {
  min-height:51px;
  padding:5px 6px 5px 19px;
  font-size:12px;
  font-weight:650;
  gap:25px;
}
body.sx-services-reimagined .sxs-hero-actions .sxs-pill-arrow {
  width:37px;
  height:37px;
}
body.sx-services-reimagined .sxs-services-wrap {padding-top:0;background:#030406;scroll-margin-top:18px}
/* The existing four cards keep the exact original dimensions, content and animations. */
@media(max-width:1250px){
  body.sx-services-reimagined .sxs-hero {height:610px;min-height:610px}
  body.sx-services-reimagined .sxs-hero-copy {top:179px}
  body.sx-services-reimagined .sxs-hero-copy h1 {font-size:clamp(46px,4.4vw,56px)}
}
@media(max-width:760px){
  body.sx-services-reimagined .sxs-hero {height:700px;min-height:700px}
  body.sx-services-reimagined .sxs-hero-art {
    background-size:auto 100%;
    background-position:center center;
  }
  body.sx-services-reimagined .sxs-hero-inner {width:calc(100% - 34px)!important;height:100%;display:block}
  body.sx-services-reimagined .sxs-hero-copy {
    top:152px;
    width:calc(100vw - 34px);
    max-width:550px;
    padding:0 4px;
  }
  body.sx-services-reimagined .sxs-eyebrow {font-size:9px;gap:12px;letter-spacing:.24em}
  body.sx-services-reimagined .sxs-eyebrow .sxs-line {width:27px;flex-basis:27px}
  body.sx-services-reimagined .sxs-hero-copy h1 {
    font-size:clamp(34px,6.8vw,47px);
    line-height:1.13;
    margin:24px 0 21px;
    white-space:normal;
  }
  body.sx-services-reimagined .sxs-hero-copy>p {
    max-width:440px;
    font-size:clamp(13px,3.3vw,16px);
    line-height:1.53;
  }
  body.sx-services-reimagined .sxs-hero-actions {gap:11px;margin-top:26px;justify-content:center}
  body.sx-services-reimagined .sxs-hero-actions .sxs-pill {font-size:11px;min-height:45px;gap:12px;padding:4px 5px 4px 13px}
  body.sx-services-reimagined .sxs-hero-actions .sxs-pill-arrow {width:33px;height:33px}
}
@media(max-width:460px){
  body.sx-services-reimagined .sxs-hero {height:665px;min-height:665px}
  body.sx-services-reimagined .sxs-hero-copy {top:137px}
  body.sx-services-reimagined .sxs-hero-copy h1 {font-size:clamp(31px,8.2vw,38px);letter-spacing:-.059em;margin:21px 0 18px}
  body.sx-services-reimagined .sxs-hero-copy>p {font-size:14px;max-width:325px}
  body.sx-services-reimagined .sxs-hero-actions {margin-top:24px;gap:10px}
  body.sx-services-reimagined .sxs-hero-actions .sxs-pill {min-height:44px;font-size:10px;gap:9px}
  body.sx-services-reimagined .sxs-hero-actions .sxs-pill-arrow {width:31px;height:31px}
}
@media(max-width:350px){
  body.sx-services-reimagined .sxs-hero-copy h1 {font-size:31px}
  body.sx-services-reimagined .sxs-hero-actions {flex-direction:column}
  body.sx-services-reimagined .sxs-hero-actions .sxs-pill {width:185px}
}
@media(prefers-reduced-motion:reduce){body.sx-services-reimagined .sxs-hero-copy,body.sx-services-reimagined .sxs-hero-actions{animation:none!important}}
/* Mobile atmosphere: a subdued nebula and partial chrome rim keep the brand's
   space identity visible without compromising headline readability. */
@media(max-width:760px){
  body.sx-services-reimagined .sxs-nebula-detail {
    display:block;
    position:absolute;
    top:49px;
    left:-27px;
    width:min(95vw,370px);
    height:185px;
    opacity:.35;
    filter:brightness(.74);
    z-index:-1;
    pointer-events:none;
  }
  body.sx-services-reimagined .sxs-hero::before {
    content:"";
    position:absolute;
    z-index:-1;
    top:55px;
    right:-25px;
    width:min(82vw,330px);
    height:340px;
    background:url('assets/services-centred-planet-mobile.webp') center top / contain no-repeat;
    opacity:.48;
    pointer-events:none;
  }
}