/* ════════════════════════════════════════════════════
   LANDING PAGES — page-specific styles only
   (Shared service-detail patterns live in service-detail.css)
   ════════════════════════════════════════════════════ */

/* ─── §02 · A-vs-B comparison cards (unique to LP) ─── */
/* Note: replaces the standard .sd-why__grid body+sidebar layout */

.lp-vs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: stretch;
}
.lp-vs-card {
  border-radius: 18px;
  padding: 32px 30px;
}
.lp-vs-card--bad {
  background: var(--cream);
  border: 1px solid var(--rule);
}
.lp-vs-card--good {
  background: var(--teal);
  color: var(--cream);
  border: 1px solid var(--teal);
  position: relative;
  overflow: hidden;
}
.lp-vs-card--good .lp-vs-card__inner { position: relative; z-index: 2; }
.lp-vs-card__bg {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 15% 0%, rgba(231,177,63,.08), transparent 45%),
    radial-gradient(circle at 85% 100%, rgba(231,177,63,.05), transparent 45%);
  pointer-events: none;
}
.lp-vs-card__label {
  font-size: 10px;
  color: var(--gold-2);
  letter-spacing: 0.22em;
  margin-bottom: 14px;
}
.lp-vs-card--good .lp-vs-card__label { color: var(--gold); }
.lp-vs-card__title {
  font-size: 24px;
  margin: 0 0 16px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.lp-vs-card--good .lp-vs-card__title { color: var(--gold); }

.lp-vs-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.lp-vs-list li {
  display: flex;
  gap: 10px;
  font-size: 14.5px;
  color: var(--ink-2);
  line-height: 1.55;
}
.lp-vs-card--good .lp-vs-list li { color: rgba(244,239,230,.92); }
.lp-vs-list__x { color: #c0392b; flex-shrink: 0; }
.lp-vs-list__check { color: var(--gold); flex-shrink: 0; }

.lp-why__note {
  font-size: 16px;
  color: var(--ink-2);
  opacity: .75;
  font-style: italic;
  margin: 28px 0 0;
  max-width: 680px;
}

/* Responsive */
@media (max-width: 800px) {
  .lp-vs { grid-template-columns: 1fr; }
}