/* Brand: sterlingservicesma.online — stamped block catalog (blk- → ste84-) */

.ste84-hero { background: var(--dna-bg, #fff); }
.ste84-hero .wrap { max-width: var(--maxw, 1120px); margin: 0 auto; padding: 0 28px; }
.ste84-hero .sub { font-size: 18px; color: var(--dna-ink-soft); }
.ste84-hero .cta { display: flex; gap: 12px; margin-top: 28px; flex-wrap: wrap; }

.ste84-hero-editorial .wrap { padding: 74px 28px 0; }
.ste84-hero-editorial .top { display: grid; grid-template-columns: 1.6fr .9fr; gap: 40px; align-items: end; padding-bottom: 34px; }
.ste84-hero-editorial h1 { font-size: 58px; line-height: 1.02; letter-spacing: -.03em; font-weight: 800; margin: 0; }
.ste84-hero-editorial h1 em { font-style: normal; color: var(--dna-accent); }
.ste84-hero-editorial .meta { border-left: 3px solid var(--dna-accent); padding-left: 18px; }
.ste84-hero-editorial .meta p { font-size: 15.5px; color: var(--dna-ink-soft); margin: 0 0 18px; }
.ste84-hero-editorial .band {
  height: 320px; border-radius: var(--radius-lg, 18px); margin: 0 0 -46px; position: relative; overflow: hidden;
  background: var(--dna-ink);
  box-shadow: 0 30px 70px -34px rgba(40, 32, 24, .45);
}
.ste84-hero-editorial .band img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ste84-hero-editorial .band::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, rgba(40,32,24,.45), rgba(141,109,94,.28)); }
.ste84-hero-editorial .band .chip {
  position: absolute; left: 26px; bottom: 24px; z-index: 2; background: rgba(255,255,255,.16); color: #fff;
  border: 1px solid rgba(255,255,255,.28); border-radius: 999px; padding: 8px 16px; font-size: 13px; font-weight: 700;
}
.ste84-hero-editorial .barcta { display: flex; gap: 12px; justify-content: flex-end; padding: 62px 0 28px; }

.ste84-svc { background: var(--dna-bg); padding: 84px 0; }
.ste84-svc .wrap { max-width: var(--maxw, 1120px); margin: 0 auto; padding: 0 28px; }
.ste84-svc .head { max-width: 560px; margin-bottom: 40px; }
.ste84-svc .head h2 { font-size: 34px; line-height: 1.1; letter-spacing: -.02em; margin: 10px 0 8px; }
.ste84-svc .head p { color: var(--dna-ink-soft); font-size: 16px; }
.ste84-svc-cards .grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ste84-svc-cards .card { background: var(--dna-surface); border: 1px solid var(--dna-line); border-radius: var(--radius-lg, 18px); padding: 26px; }
.ste84-svc-cards .ic { width: 46px; height: 46px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--dna-accent) 14%, transparent); color: var(--dna-accent); margin-bottom: 16px; }
.ste84-svc-cards h3 { font-size: 19px; margin: 0 0 8px; }
.ste84-svc-cards p { font-size: 14.5px; color: var(--dna-ink-soft); margin: 0; }

.ste84-about { background: var(--dna-surface-2); padding: 84px 0; }
.ste84-about .wrap { max-width: var(--maxw, 1120px); margin: 0 auto; padding: 0 28px; }
.ste84-about-splitimage .grid { display: grid; grid-template-columns: .95fr 1.05fr; gap: 54px; align-items: center; }
.ste84-about-splitimage .frame { border-radius: var(--radius-lg, 20px); overflow: hidden; min-height: 340px; border: 1px solid var(--dna-line); background: var(--dna-surface); }
.ste84-about-splitimage .frame img { width: 100%; height: 100%; object-fit: cover; display: block; min-height: 340px; }
.ste84-about-splitimage h2 { font-size: 34px; line-height: 1.12; letter-spacing: -.02em; margin: 10px 0 14px; }
.ste84-about-splitimage p { color: var(--dna-ink-soft); font-size: 16px; margin: 0 0 14px; }
.ste84-about-splitimage ul { list-style: none; display: grid; gap: 10px; margin: 18px 0 0; padding: 0; }
.ste84-about-splitimage li { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; }
.ste84-about-splitimage li::before { content: "·"; color: var(--dna-accent); font-weight: 800; }

.ste84-trust { background: var(--dna-bg); padding: 64px 0; }
.ste84-trust .wrap { max-width: var(--maxw, 1120px); margin: 0 auto; padding: 0 28px; }
.ste84-trust-featuretiles .tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.ste84-trust-featuretiles .tile { background: var(--dna-surface-2); border: 1px solid var(--dna-line); border-radius: 16px; padding: 26px; }
.ste84-trust-featuretiles .ic { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--dna-surface); border: 1px solid var(--dna-line); color: var(--dna-accent); margin-bottom: 16px; }
.ste84-trust-featuretiles h3 { font-size: 18px; margin: 0 0 8px; }
.ste84-trust-featuretiles p { font-size: 14.5px; color: var(--dna-ink-soft); margin: 0; }

.ste84-proc { background: var(--dna-surface-2); padding: 84px 0; }
.ste84-proc .wrap { max-width: var(--maxw, 1120px); margin: 0 auto; padding: 0 28px; }
.ste84-proc .head { max-width: 560px; margin-bottom: 44px; }
.ste84-proc .head h2 { font-size: 34px; line-height: 1.1; letter-spacing: -.02em; margin: 10px 0 8px; }
.ste84-proc .head p { color: var(--dna-ink-soft); font-size: 16px; }
.ste84-proc-timeline .line { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; position: relative; }
.ste84-proc-timeline .line::before { content: ""; position: absolute; left: 7%; right: 7%; top: 19px; height: 2px; background: var(--dna-line); }
.ste84-proc-timeline .node { text-align: center; padding: 0 14px; position: relative; }
.ste84-proc-timeline .dot { width: 40px; height: 40px; border-radius: 50%; background: var(--dna-surface); border: 2px solid var(--dna-accent); color: var(--dna-accent); display: flex; align-items: center; justify-content: center; font-weight: 800; margin: 0 auto 18px; position: relative; z-index: 2; }
.ste84-proc-timeline h3 { font-size: 16px; margin: 0 0 6px; }
.ste84-proc-timeline p { font-size: 13.5px; color: var(--dna-ink-soft); margin: 0; }

.ste84-cta { padding: 76px 0; }
.ste84-cta .wrap { max-width: var(--maxw, 1120px); margin: 0 auto; padding: 0 28px; }
.ste84-cta-boxed { background: var(--dna-bg); }
.ste84-cta-boxed .box { background: var(--dna-surface-2); border: 1px solid var(--dna-line); border-radius: var(--radius-lg, 22px); padding: 48px; text-align: center; }
.ste84-cta-boxed h2 { font-size: 32px; line-height: 1.12; letter-spacing: -.02em; margin: 0 0 12px; }
.ste84-cta-boxed p { font-size: 16px; color: var(--dna-ink-soft); margin: 0 auto 26px; max-width: 520px; }

@media (max-width: 860px) {
  .ste84-hero-editorial .top { grid-template-columns: 1fr; gap: 22px; }
  .ste84-hero-editorial h1 { font-size: 40px; }
  .ste84-hero-editorial .barcta { justify-content: flex-start; padding-top: 70px; }
  .ste84-svc-cards .grid,
  .ste84-about-splitimage .grid,
  .ste84-trust-featuretiles .tiles { grid-template-columns: 1fr; gap: 22px; }
  .ste84-proc-timeline .line { grid-template-columns: 1fr 1fr; gap: 28px 0; }
  .ste84-proc-timeline .line::before { display: none; }
}