/* ===== Suppliers page ===== */

/* Alternating feature rows */
.sup-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(36px, 5vw, 72px);
  align-items: center;
}
.sup-row + .sup-row { margin-top: clamp(56px, 8vw, 96px); }
.sup-row-media img {
  width: 100%;
  aspect-ratio: 16 / 11;
  object-fit: cover;
  border-radius: var(--radius-lg, 22px);
  box-shadow: var(--shadow-lg, 0 24px 60px -24px rgba(23,10,17,.28));
}
.sup-row.rev .sup-row-media { order: 2; }
.sup-row.rev .sup-row-copy { order: 1; }
.sup-row-copy .eyebrow { margin-bottom: 10px; }
.sup-row-copy h3 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.5rem, 2.6vw, 2.1rem);
  color: var(--ink);
  line-height: 1.15;
  margin-bottom: 14px;
}
.sup-row-copy p { color: var(--muted); font-size: .98rem; margin-bottom: 14px; }

/* Tick list inside rows */
.sup-list { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 10px; }
.sup-list li {
  position: relative;
  padding-left: 30px;
  color: var(--ink);
  font-size: .95rem;
  font-weight: 500;
}
.sup-list li::before {
  content: "";
  position: absolute; left: 0; top: 1px;
  width: 20px; height: 20px; border-radius: 50%;
  background: var(--leaf) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/11px 11px no-repeat;
}

/* Become-a-supplier 3-step strip */
.sup-steps { background: var(--paper-2); }
.sup-steps-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(20px, 3vw, 36px);
  margin-top: 8px;
}
.sup-step {
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: var(--radius, 18px);
  padding: clamp(26px, 3vw, 36px) clamp(22px, 2.6vw, 32px);
  position: relative;
}
.sup-step-num {
  display: inline-grid; place-items: center;
  width: 46px; height: 46px; border-radius: 50%;
  background: linear-gradient(135deg, var(--leaf-soft), var(--leaf));
  color: #fff;
  font-family: var(--font-display);
  font-size: 1.25rem;
  margin-bottom: 16px;
  box-shadow: 0 10px 24px -8px rgba(76,159,19,.5);
}
.sup-step h3 { font-size: 1.08rem; font-weight: 700; color: var(--ink); margin-bottom: 8px; }
.sup-step p { color: var(--muted); font-size: .93rem; margin: 0; }
.sup-step-note { text-align: center; color: var(--muted); font-size: .9rem; margin-top: 28px; }
.sup-step-note a { color: var(--leaf-deep); font-weight: 600; text-decoration: none; }
.sup-step-note a:hover { text-decoration: underline; }

/* Closing CTA */
.sup-cta { text-align: center; }
.sup-cta .section-sub { margin-left: auto; margin-right: auto; }
.sup-cta .hero-actions { justify-content: center; margin-top: 34px; }
.sup-cta-contact { margin-top: 22px; color: var(--muted); font-size: .92rem; }
.sup-cta-contact a { color: var(--ink); font-weight: 600; text-decoration: none; }
.sup-cta-contact a:hover { color: var(--pink-deep); }

@media (max-width: 900px) {
  .sup-row { grid-template-columns: 1fr; gap: 26px; }
  .sup-row.rev .sup-row-media { order: 0; }
  .sup-row.rev .sup-row-copy { order: 0; }
  .sup-steps-grid { grid-template-columns: 1fr; }
}
