/* /products/: the four products as four equal cards, two by two, each led by its own screen. Scoped under .pl. */
.pl-open { padding: 72px 0 8px; }
.pl-lede { font-size: 1.15rem; color: var(--ink2); max-width: 46rem; margin: 0; }
.pl-cards { padding: 40px 0 80px; }
.pl-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.pl-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden;
  text-decoration: none; color: var(--navy); transition: box-shadow .2s, transform .2s; }
.pl-card:hover { box-shadow: 0 24px 54px rgba(1,27,70,.14); transform: translateY(-3px); }
.pl-img { height: 280px; overflow: hidden; background: var(--alt); border-bottom: 1px solid var(--line); padding: 28px 28px 0; }
.pl-img img { width: 100%; border-radius: 8px 8px 0 0; box-shadow: 0 12px 30px rgba(1,27,70,.14); object-fit: cover; object-position: left top; }
.pl-body { padding: 26px 28px 26px; display: flex; flex-direction: column; flex: 1; }
.pl-tag { font-size: .82rem; font-weight: 700; color: var(--green); }
.pl-card h2 { font-size: 1.7rem; margin: 6px 0 10px; }
.pl-body p { color: var(--ink2); margin: 0 0 22px; }
.pl-foot { margin-top: auto; display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; border-top: 1px solid var(--line); padding-top: 18px; }
.pl-price b { display: block; font-family: var(--head); font-weight: 900; font-size: 1.45rem; line-height: 1.1; }
.pl-price span { font-size: .85rem; color: var(--muted); }
.pl-foot i { font-style: normal; font-weight: 700; color: var(--green); font-size: .95rem; white-space: nowrap; }
.pl-key { color: var(--muted); font-size: .95rem; margin: 28px 0 0; text-align: center; }
.pl-reg { padding: 80px 0; text-align: center; }
.pl-reg-in { max-width: 640px; }
@media (max-width: 860px) {
  .pl-open { padding-top: 44px; }
  .pl-grid { grid-template-columns: 1fr; gap: 20px; }
  .pl-img { height: 200px; padding: 18px 18px 0; }
  .pl-body { padding: 22px 20px; }
  .pl-foot { flex-direction: column; align-items: flex-start; }
}
