/* ===== OUR PROMISES PAGE (theme 1.23.0) ===== */
.op-promises-page { padding: 2.5rem 0 4rem; }

.op-promises-hero { max-width: 760px; margin: 0 auto 2.5rem; text-align: center; }
.op-promises-hero__eyebrow {
  display: inline-block;
  font-size: var(--op-text-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--op-primary);
  margin-bottom: 0.75rem;
}
.op-promises-hero h1 { font-size: clamp(2rem, 4vw, 2.75rem); margin: 0 0 0.75rem; text-wrap: balance; }
.op-promises-hero p { color: var(--op-text-secondary); font-size: 1.05rem; line-height: 1.6; margin: 0 0 1.25rem; }
.op-promises-hero__actions { display: flex; gap: 0.75rem; justify-content: center; flex-wrap: wrap; }

.op-promises-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-bottom: 3rem;
}
.op-promise {
  background: #fff;
  border: 1px solid var(--op-border, #E2E8F0);
  border-radius: var(--op-radius-lg, 14px);
  padding: 1.25rem 1.35rem;
  scroll-margin-top: 120px;
}
.op-promise h2 {
  font-size: 1.05rem;
  margin: 0 0 0.5rem;
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
}
.op-promise h2::before {
  content: "";
  flex: 0 0 auto;
  width: 22px; height: 22px;
  margin-top: 0.05rem;
  border-radius: 50%;
  background: #D1FAE5 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/13px no-repeat;
}
.op-promise p { margin: 0; color: var(--op-text-secondary); font-size: 0.93rem; line-height: 1.6; }

.op-promises-section { max-width: 900px; margin: 0 auto 2.75rem; scroll-margin-top: 120px; }
.op-promises-section h2 { font-size: 1.35rem; margin: 0 0 0.9rem; }
.op-promises-section p { color: var(--op-text-secondary); line-height: 1.65; }
.op-promises-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.op-promises-note { font-size: 0.88rem; margin-top: 0.75rem; }

.op-promises-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border: 1px solid var(--op-border, #E2E8F0);
  border-radius: var(--op-radius, 10px);
  overflow: hidden;
  font-size: 0.93rem;
}
.op-promises-table th, .op-promises-table td { padding: 0.7rem 0.9rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--op-border, #E2E8F0); }
.op-promises-table thead th { background: #F8FAFC; font-size: var(--op-text-xs); text-transform: uppercase; letter-spacing: 0.05em; color: var(--op-text-secondary); }
.op-promises-table tbody tr:last-child td { border-bottom: 0; }

.op-promises-cta {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
  background: var(--op-primary-light, #ECFEFF);
  border-radius: var(--op-radius-lg, 14px);
  padding: 2rem 1.5rem;
}
.op-promises-cta h2 { margin: 0 0 0.4rem; }
.op-promises-cta p { margin: 0 0 1rem; color: var(--op-text-secondary); }
.op-promises-contact { font-size: 0.85rem; margin-top: 1.25rem !important; }

@media (max-width: 900px) {
  .op-promises-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .op-promises-grid, .op-promises-columns { grid-template-columns: 1fr; }
  .op-promises-table { display: block; overflow-x: auto; }
}

/* Showroom photo behind the hero */
.op-promises-hero--photo {
  position: relative;
  max-width: none;
  padding: 3rem 1.5rem;
  border-radius: var(--op-radius-lg, 16px);
  background-size: cover;
  background-position: center;
  color: #fff;
  overflow: hidden;
}
.op-promises-hero--photo::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(7, 26, 43, 0.72), rgba(7, 26, 43, 0.86)); }
.op-promises-hero--photo > * { position: relative; z-index: 1; }
.op-promises-hero--photo h1, .op-promises-hero--photo p { color: #fff; }
.op-promises-hero--photo .op-promises-hero__eyebrow { color: #7DE3F2; }
.op-promises-hero--photo .op-btn-outline { color: #fff; border-color: rgba(255,255,255,0.55); }