.fabric-landing-page {
  --fabric-orange: #f99f3f;
  --fabric-navy: #000e3c;
  --fabric-blue: #003e73;
  --fabric-teal: #00abb6;
  --fabric-mist: #f3f6f9;
}

.fabric-landing-page.group-devops { --fabric-orange: #a967aa; }
.fabric-landing-page.group-data { --fabric-orange: #00abb6; }
.fabric-landing-page.group-analytics { --fabric-orange: #f99f3f; }

.fabric-landing-page .page-header__hero-content__header {
  max-width: 18ch;
  font-size: clamp(4rem, 4.4vw, 7.2rem);
  line-height: .98;
}

.fabric-landing-page .page-header__hero-content__intro {
  max-width: 58rem;
}

.fabric-landing-page .service-hero-action .button--default,
.fabric-landing-page .fabric-cta {
  width: auto;
  min-width: min(100%, 29rem);
  background: var(--fabric-orange) !important;
  color: var(--fabric-navy) !important;
}

.fabric-landing-page .service-hero-action .button--default span,
.fabric-landing-page .fabric-cta span {
  color: inherit !important;
}

.fabric-landing-page .service-hero-action__note {
  max-width: 42rem;
  font-size: 1.8rem;
}

.fabric-outcomes,
.fabric-review,
.fabric-approach,
.fabric-proof,
.fabric-enquiry {
  padding: clamp(7.2rem, 7vw, 12rem) 0;
}

.fabric-outcomes h2,
.fabric-review h2,
.fabric-approach h2,
.fabric-proof h2,
.fabric-enquiry h2 {
  max-width: 90rem;
  margin-bottom: 1.8rem;
}

.fabric-section-lead,
.fabric-review__intro > p:not(.cb__kicker),
.fabric-approach__heading > p:not(.cb__kicker),
.fabric-proof__layout > div > p:not(.cb__kicker),
.fabric-enquiry__intro > p:not(.cb__kicker) {
  max-width: 76rem;
  color: #42536a;
  font-size: clamp(2rem, 1.6vw, 2.6rem);
  line-height: 1.45;
}

.fabric-outcome-grid {
  display: grid;
  gap: 2rem;
  margin-top: clamp(4rem, 4vw, 6.4rem);
}

.fabric-outcome {
  position: relative;
  padding: 3.2rem;
  border: 1px solid #d7e1ea;
  border-top: .5rem solid var(--fabric-orange);
  border-radius: 0 0 2rem 2rem;
  background: #fff;
}

.fabric-outcome > span {
  display: block;
  margin-bottom: 2.4rem;
  color: var(--fabric-orange);
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: .12em;
}

.fabric-outcome h3 { margin-bottom: 1rem; }
.fabric-outcome p { margin: 0; color: #42536a; }

.fabric-review {
  scroll-margin-top: 12rem;
  color: #fff;
  background:
    linear-gradient(108deg, rgba(0, 62, 115, .96) 0 29%, rgba(0, 37, 86, .98) 29% 72%, rgba(0, 14, 60, 1) 72% 100%);
}

.fabric-review .cb__kicker,
.fabric-approach .cb__kicker,
.fabric-enquiry .cb__kicker { color: var(--fabric-orange); }
.fabric-review h2,
.fabric-review__intro > p:not(.cb__kicker) { color: #fff; }

.fabric-review__layout {
  display: grid;
  gap: clamp(4rem, 6vw, 9rem);
  align-items: center;
}

.fabric-review__intro .fabric-cta { margin-top: 3.2rem; }

.fabric-review__deliverables {
  padding: clamp(3.2rem, 4vw, 5.2rem);
  border: 1px solid color-mix(in srgb, var(--fabric-orange) 55%, transparent);
  border-radius: 2.4rem;
  background: rgba(0, 4, 52, .62);
  box-shadow: 0 2rem 5rem rgba(0, 4, 52, .24);
}

.fabric-review__label {
  margin-bottom: .8rem;
  color: var(--fabric-orange);
  font-size: 2.4rem;
  font-weight: 700;
  text-transform: uppercase;
}

.fabric-review__deliverables > p:not(.fabric-review__label) { color: rgba(255, 255, 255, .82); }
.fabric-review__deliverables ul { margin: 2.8rem 0 0; padding: 0; list-style: none; }
.fabric-review__deliverables li {
  position: relative;
  padding: 1.4rem 0 1.4rem 3.2rem;
  border-top: 1px solid rgba(255, 255, 255, .14);
}
.fabric-review__deliverables li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2.1rem;
  width: 1rem;
  height: 1rem;
  transform: rotate(45deg);
  background: var(--fabric-orange);
}

.fabric-approach { background: var(--fabric-mist); }
.fabric-approach__heading { max-width: 78rem; margin-bottom: clamp(4rem, 5vw, 7rem); }

.fabric-steps { display: grid; gap: 2rem; }
.fabric-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2rem;
  padding: 2.8rem;
  border-radius: 1.6rem;
  background: #fff;
  box-shadow: 0 1.2rem 3rem rgba(0, 52, 105, .08);
}
.fabric-step__number { color: var(--fabric-orange); font-size: 1.6rem; font-weight: 700; letter-spacing: .1em; }
.fabric-step h3 { margin: 0 0 .8rem; }
.fabric-step p { margin: 0; color: #42536a; }

.fabric-technology {
  display: grid;
  gap: 2rem;
  margin-top: 2rem;
  padding: 3.2rem;
  border-radius: 1.6rem;
  color: #fff;
  background: var(--fabric-navy);
}
.fabric-technology h3 { margin: 0; color: #fff; }
.fabric-technology p { margin: 0; color: rgba(255,255,255,.84); }

.fabric-proof { background: #fff; }
.fabric-proof__layout { display: grid; gap: clamp(4rem, 6vw, 8rem); align-items: center; }
.fabric-proof figure {
  margin: 0;
  padding: clamp(3.2rem, 4vw, 5.2rem);
  border-left: .7rem solid var(--fabric-orange);
  border-radius: 0 2rem 2rem 0;
  background: color-mix(in srgb, var(--fabric-orange) 8%, #fff);
}
.fabric-proof blockquote,
.fabric-proof__statement { margin: 0; color: var(--fabric-blue); font-size: clamp(2.2rem, 2vw, 3.2rem); line-height: 1.4; }
.fabric-proof figcaption { display: grid; margin-top: 2.4rem; color: #42536a; }
.fabric-proof figcaption strong { color: var(--fabric-navy); }

.fabric-enquiry {
  scroll-margin-top: 10rem;
  color: #fff;
  background:
    linear-gradient(112deg, rgba(0,62,115,.96), rgba(0,14,60,.99)),
    var(--fabric-navy);
}
.fabric-enquiry h2,
.fabric-enquiry__intro > p:not(.cb__kicker) { color: #fff; }
.fabric-enquiry__layout { display: grid; gap: clamp(4rem, 6vw, 8rem); align-items: start; }
.fabric-enquiry__promise { display: grid; grid-template-columns: auto 1fr; gap: 1.6rem; margin-top: 3.2rem; max-width: 60rem; }
.fabric-enquiry__promise > span { width: 1.4rem; height: 1.4rem; margin-top: .7rem; transform: rotate(45deg); background: var(--fabric-orange); }
.fabric-enquiry__promise p { margin: 0; color: rgba(255,255,255,.84); }

.fabric-form-card { padding: clamp(2.4rem, 3vw, 4rem); }
.fabric-form-card form { gap: 1.8rem; }
.fabric-form-grid { display: grid; gap: 1.8rem; }
.fabric-form-card textarea { min-height: 11rem; }
.fabric-form-submit { width: 100%; background: var(--fabric-orange) !important; color: var(--fabric-navy) !important; }
.fabric-form-submit span { color: inherit !important; }
.fabric-form-card .form-note { margin: 0; }

@media (min-width: 769px) {
  .fabric-outcome-grid,
  .fabric-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fabric-review__layout,
  .fabric-proof__layout,
  .fabric-enquiry__layout { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
  .fabric-technology { grid-template-columns: minmax(24rem, .65fr) minmax(0, 1.35fr); align-items: center; }
  .fabric-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  .fabric-landing-page .page-header__hero-content__header { max-width: 15ch; font-size: clamp(3.8rem, 12vw, 5.4rem); }
  .fabric-outcomes,
  .fabric-review,
  .fabric-approach,
  .fabric-proof,
  .fabric-enquiry { padding: 6.4rem 0; }
  .fabric-review__deliverables,
  .fabric-proof figure { padding: 2.8rem 2.4rem; }
}