:root {
  --sx-forest: #0d2d25;
  --sx-green: #173a32;
  --sx-gold: #c8a45b;
  --sx-cream: #f3eddf;
  --sx-ink: #17201e;
  --sx-muted: #5a6561;
}

.sx-hero {
  position: relative;
  min-height: 680px;
  display: grid;
  align-items: end;
  padding: 160px 0 78px;
  color: #fff;
  overflow: hidden;
  background: var(--sx-forest);
}

.sx-hero-media,
.sx-hero-media::after {
  position: absolute;
  inset: 0;
}

.sx-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sx-hero-media::after {
  content: "";
  background: linear-gradient(90deg, rgba(6, 30, 24, .94) 0%, rgba(8, 37, 30, .82) 44%, rgba(8, 37, 30, .28) 76%, rgba(8, 37, 30, .14) 100%), linear-gradient(0deg, rgba(5, 25, 21, .52), transparent 50%);
}

.sx-hero-content {
  position: relative;
  z-index: 1;
  max-width: 760px;
}

.sx-kicker {
  margin: 0 0 18px;
  color: #dfc587;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.sx-hero h1 {
  margin: 0 0 26px;
  color: #fff;
  font-size: clamp(46px, 6.6vw, 82px);
  line-height: .98;
  max-width: 800px;
}

.sx-hero p:last-child {
  max-width: 700px;
  margin: 0;
  color: rgba(255, 255, 255, .84);
  font-size: clamp(17px, 2vw, 21px);
  line-height: 1.68;
}

.sx-section {
  padding: 96px 0;
  background: #fbf8f1;
}

.sx-section.alt { background: var(--sx-cream); }
.sx-section.dark { background: var(--sx-forest); color: #fff; }

.sx-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(280px, .72fr);
  gap: 48px;
  align-items: end;
  margin-bottom: 48px;
}

.sx-heading h2 {
  margin: 0;
  color: var(--sx-green);
  font-size: clamp(36px, 5vw, 60px);
  line-height: 1.04;
}

.sx-section.dark .sx-heading h2 { color: #fff; }

.sx-heading > p,
.sx-copy {
  margin: 0;
  color: var(--sx-muted);
  font-size: 17px;
  line-height: 1.75;
}

.sx-section.dark .sx-heading > p,
.sx-section.dark .sx-copy { color: rgba(255, 255, 255, .74); }

.sx-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.sx-card {
  background: #fff;
  border: 1px solid rgba(20, 59, 48, .14);
  box-shadow: 0 18px 48px rgba(13, 45, 37, .07);
  overflow: hidden;
}

.sx-card img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  display: block;
  object-fit: cover;
}

.sx-card-body { padding: 28px; }

.sx-card-number {
  display: block;
  margin-bottom: 13px;
  color: #7b622d;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.sx-card h3 {
  margin: 0 0 12px;
  color: var(--sx-green);
  font-size: 27px;
  line-height: 1.14;
}

.sx-card p,
.sx-card li {
  color: var(--sx-muted);
  line-height: 1.7;
}

.sx-card ul {
  margin: 16px 0 0;
  padding-left: 19px;
}

.sx-card-link {
  display: inline-block;
  margin-top: 18px;
  color: var(--sx-green);
  font-weight: 800;
  border-bottom: 1px solid var(--sx-gold);
}

.sx-lanes {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  counter-reset: lane;
  border-top: 1px solid rgba(255, 255, 255, .2);
  border-bottom: 1px solid rgba(255, 255, 255, .2);
}

.sx-lane {
  position: relative;
  padding: 30px 22px;
  counter-increment: lane;
}

.sx-lane + .sx-lane { border-left: 1px solid rgba(255, 255, 255, .2); }
.sx-lane::before { content: "0" counter(lane); display: block; margin-bottom: 30px; color: #dfc587; font-weight: 800; font-size: 12px; letter-spacing: .14em; }
.sx-lane h3 { margin: 0 0 11px; color: #fff; font-size: 22px; }
.sx-lane p { margin: 0; color: rgba(255, 255, 255, .68); font-size: 14px; line-height: 1.65; }

.sx-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .86fr);
  gap: 60px;
  align-items: center;
}

.sx-photo {
  margin: 0;
  border: 1px solid rgba(20, 59, 48, .16);
  background: var(--sx-forest);
  box-shadow: 0 24px 56px rgba(13, 45, 37, .12);
}

.sx-photo img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  display: block;
  object-fit: cover;
}

.sx-photo figcaption {
  padding: 12px 16px;
  color: rgba(255, 255, 255, .68);
  font-size: 11px;
  line-height: 1.5;
}

.sx-checklist {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 30px;
}

.sx-check {
  padding: 18px;
  background: #fff;
  border-left: 3px solid var(--sx-gold);
  color: var(--sx-green);
  font-weight: 700;
}

.sx-market-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.sx-market {
  min-height: 220px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #fff;
  background: linear-gradient(145deg, #173a32, #0d2d25);
  border-top: 3px solid var(--sx-gold);
}

.sx-market span { color: #dfc587; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.sx-market h3 { margin: 14px 0 9px; color: #fff; font-size: 27px; }
.sx-market p { margin: 0; color: rgba(255,255,255,.7); line-height: 1.6; }
.sx-sector-link { transition: transform .2s ease, box-shadow .2s ease; }
.sx-sector-link:hover { transform: translateY(-3px); box-shadow: 0 18px 42px rgba(13,45,37,.18); }
.sx-sector-link .sx-card-link { color: #dfc587; border-color: rgba(223,197,135,.7); }
.sx-sector-list { margin: 14px 0 0; padding-left: 18px; color: rgba(255,255,255,.76); line-height: 1.75; }
.sx-sector-list li + li { margin-top: 4px; }

.sx-proof {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.sx-proof div {
  padding: 27px;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .14);
}

.sx-proof strong { display: block; margin-bottom: 10px; color: #fff; font-size: 19px; }
.sx-proof span { color: rgba(255,255,255,.68); line-height: 1.65; }

.sx-cta {
  padding: 72px 0;
  background: #c8a45b;
  color: #102f27;
}

.sx-cta .shell {
  display: flex;
  gap: 40px;
  align-items: center;
  justify-content: space-between;
}

.sx-cta h2 { margin: 0 0 8px; color: #102f27; font-size: clamp(31px, 4vw, 48px); }
.sx-cta p { margin: 0; max-width: 720px; }
.sx-cta .button { flex: 0 0 auto; background: #102f27; color: #fff; border-color: #102f27; }

.home-cap-card-link { display: block; }
.home-cap-card-link:hover h3 { color: #8b6d2b; }
.home-page-links { margin-top: 34px; display: flex; gap: 14px; flex-wrap: wrap; }

@media (max-width: 980px) {
  .sx-heading,
  .sx-split { grid-template-columns: 1fr; }
  .sx-card-grid,
  .sx-market-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sx-lanes { grid-template-columns: 1fr 1fr; }
  .sx-lane:nth-child(odd) { border-left: 0; }
  .sx-lane:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.2); }
  .sx-photo img { height: auto; }
}

@media (max-width: 700px) {
  .sx-hero { min-height: 610px; padding: 132px 0 62px; }
  .sx-hero-media::after { background: linear-gradient(0deg, rgba(6, 30, 24, .96), rgba(8, 37, 30, .54)); }
  .sx-section { padding: 72px 0; }
  .sx-heading { gap: 22px; margin-bottom: 34px; }
  .sx-card-grid,
  .sx-market-grid,
  .sx-proof,
  .sx-checklist,
  .sx-lanes { grid-template-columns: 1fr; }
  .sx-lane + .sx-lane { border-left: 0; border-top: 1px solid rgba(255,255,255,.2); }
  .sx-card img { height: auto; min-height: 0; max-height: none; }
  .sx-cta .shell { align-items: flex-start; flex-direction: column; }
}

/* Process diagrams use their own proportions; never crop labels to a photo frame. */
.sx-card img[src$=".svg"],
.sx-photo img[src$=".svg"]{height:auto;min-height:0;max-height:none;aspect-ratio:auto;object-fit:contain}