/* Visitor management LP: page-specific section layouts */

.pp-visitor-overview {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
  gap: 38px;
  align-items: center;
  margin-top: 36px;
}

.pp-visitor-overview__content p {
  margin: 0 0 18px;
  color: #52635a;
  font-size: 1.15rem;
  line-height: 1.9;
}

.pp-visitor-overview__list {
  display: grid;
  gap: 10px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.pp-visitor-overview__list li {
  position: relative;
  padding: 12px 16px 12px 46px;
  border: 1px solid #dce9e3;
  border-radius: 12px;
  background: #f4fbf8;
  color: #28483a;
  font-size: 1.05rem;
  font-weight: 700;
}

.pp-visitor-overview__list li::before {
  position: absolute;
  top: 50%;
  left: 17px;
  color: #168557;
  font-size: 1.25rem;
  content: "✓";
  transform: translateY(-50%);
}

.pp-visitor-overview__media {
  overflow: hidden;
  border-radius: 22px;
  box-shadow: 0 14px 34px rgba(32, 74, 53, .12);
}

.pp-visitor-overview__media img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

#features .pp-capabilities-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-top: 36px;
}

#features .pp-capability {
  height: 100%;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  flex-direction: column;
  gap: 0;
}

#features .pp-capability__media {
  display: flex;
  flex: none;
  width: 100%;
  height: 220px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 18px 18px 0 0;
  background: #eef7f4;
}

#features .pp-capability__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#features .pp-capability__media--illustration img {
  width: 74%;
  height: 74%;
  object-fit: contain;
}

#features .pp-capability__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: flex-start;
  padding: 24px 26px 28px;
}

#features .pp-capability__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin: 16px 0 0;
  padding: 0;
  color: #52635a;
  list-style: none;
}

#features .pp-capability__list li {
  position: relative;
  padding-left: 20px;
  font-size: 1rem;
  line-height: 1.7;
}

#features .pp-capability__list li::before {
  position: absolute;
  top: 0;
  left: 0;
  color: #168557;
  font-weight: 700;
  content: "✓";
}

.pp-features-all-link {
  margin: 32px 0 0;
  text-align: center;
}

.pp-features-all-link a,
.pp-qr-pricing__link {
  color: #168557;
  font-size: 1.1rem;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 4px;
}

#flow .pp-flow-list { gap: 22px; }
#flow .pp-flow-list .pp-flow-row { grid-template-columns: 76px 18px minmax(150px, 200px) minmax(0, 1fr); }
#flow .pp-flow-list .pp-flow-row:not(:last-child)::before { left: 36px; top: 50%; bottom: calc(-22px - 50%); width: 3px; border-radius: 999px; background: #b9dfd2; }
#flow .pp-flow-list .pp-flow-row::after { left: 94px; border: 1px solid #e2ede8; border-radius: 20px; box-shadow: 0 8px 22px rgba(45, 92, 73, .055); }
#flow .pp-flow-list .pp-flow-row__step { width: 72px; height: 72px; border: 5px solid #fff; border-radius: 50%; background: #e9f7f2; color: #258b6d; box-shadow: 0 6px 16px rgba(45, 130, 101, .10); font-family: inherit; font-size: 22px; letter-spacing: 0; }
#flow .pp-flow-list .pp-flow-row__media { height: 172px; border-radius: 20px 0 0 20px; background: radial-gradient(circle at 58% 46%, #f8fdfb 0%, #edf9f5 58%, #e6f5ef 100%); }
#flow .pp-flow-list .pp-flow-row__media img { width: 120px; height: 120px; object-fit: contain; filter: none; }

.pp-service-comparison__scroll {
  margin-top: 36px;
  overflow-x: auto;
  border: 1px solid #dce9e3;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(32, 74, 53, .06);
}

.pp-service-comparison {
  width: 100%;
  min-width: 720px;
  border-collapse: separate;
  border-spacing: 0;
  color: #42544b;
  font-size: 1.05rem;
  line-height: 1.65;
}

.pp-service-comparison th,
.pp-service-comparison td {
  padding: 15px 18px;
  border-right: 1px solid #e1ebe6;
  border-bottom: 1px solid #e1ebe6;
  text-align: center;
  vertical-align: middle;
}

.pp-service-comparison th:last-child,
.pp-service-comparison td:last-child { border-right: 0; }
.pp-service-comparison tbody tr:last-child th,
.pp-service-comparison tbody tr:last-child td { border-bottom: 0; }
.pp-service-comparison thead th { background: #edf7f3; color: #28483a; }
.pp-service-comparison tbody th { width: 30%; background: #f8fbfa; text-align: left; }
.pp-service-comparison__pp { background: #f0faf6; }
.pp-service-comparison__pp strong { color: #137a51; }
.pp-service-comparison__note { margin: 14px 0 0; color: #67766e; font-size: .9rem; line-height: 1.7; }

.pp-service-comparison__summary {
  margin-top: 26px;
  padding: 26px 28px;
  border: 1px solid #cfe5dc;
  border-radius: 16px;
  background: #f3faf7;
  text-align: center;
}

.pp-service-comparison__summary h3 { margin: 0 0 10px; color: #254a3a; font-size: 24px; line-height: 1.5; }
.pp-service-comparison__summary p { margin: 0; color: #52635a; font-size: 1.05rem; line-height: 1.8; }

.pp-implementation-cards.pp-strengths-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 36px;
}

.pp-implementation-cards .pp-strength-card {
  position: relative;
  min-width: 0;
  min-height: 0;
  height: auto;
  padding: 26px 24px 24px;
  overflow: hidden;
  border: 1px solid #dce9e3;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(32, 74, 53, .07);
}

.pp-implementation-cards .pp-strength-card::before { display: none; }
.pp-implementation-card__head { display: flex; gap: 13px; align-items: center; margin-bottom: 16px; }
.pp-implementation-card__number { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border-radius: 50%; background: #e6f6ef; color: #168557; font-size: 1.2rem; font-weight: 700; }
.pp-implementation-cards .pp-strength-card__title { margin: 0; color: #243c31; font-size: 22px; line-height: 1.5; }
.pp-implementation-cards .pp-strength-card__desc { margin: 0; color: #52635a; font-size: 1.05rem; line-height: 1.8; }
.pp-implementation-cta { margin-top: 32px; }

.pp-qr-pricing { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr); gap: 24px; margin-top: 36px; }
.pp-qr-pricing__price,
.pp-qr-pricing__group { border: 1px solid #dce9e3; border-radius: 16px; background: #fff; box-shadow: 0 8px 24px rgba(32, 74, 53, .07); }
.pp-qr-pricing__price { padding: 28px; }
.pp-qr-pricing__label { display: block; margin-bottom: 18px; color: #168557; font-size: 1.2rem; font-weight: 700; text-align: center; }
.pp-qr-pricing__price dl { margin: 0; }
.pp-qr-pricing__price dl > div { padding: 16px 0; border-top: 1px solid #e3ece7; }
.pp-qr-pricing__price dt { margin-bottom: 8px; color: #52635a; font-weight: 700; }
.pp-qr-pricing__price dd { margin: 0; color: #263d32; text-align: right; }
.pp-qr-pricing__price dd strong { color: #137a51; font-size: 2rem; }
.pp-qr-pricing__price dd span { margin-left: 4px; }
.pp-qr-pricing__price dd small { display: block; color: #708078; font-size: .85rem; }
.pp-qr-pricing__price > p,
.pp-qr-pricing__note { color: #66756e; line-height: 1.7; }
.pp-qr-pricing__details { display: grid; gap: 18px; }
.pp-qr-pricing__group { padding: 24px 26px; }
.pp-qr-pricing__group h3 { margin: 0 0 14px; color: #28483a; font-size: 22px; }
.pp-qr-pricing__group h3 span { display: inline-block; margin-right: 10px; padding: 3px 9px; border-radius: 999px; background: #e5f5ee; color: #168557; font-size: .85rem; }
.pp-qr-pricing__group ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pp-qr-pricing__group li { position: relative; padding-left: 20px; color: #52635a; line-height: 1.7; }
.pp-qr-pricing__group li::before { position: absolute; top: 0; left: 0; color: #168557; font-weight: 700; content: "✓"; }
.pp-qr-pricing__note { margin: 16px 0 0; font-size: .9rem; }
.pp-qr-pricing__actions { display: flex; gap: 24px; align-items: center; justify-content: center; margin-top: 28px; }

@media (max-width: 1023px) {
  .pp-visitor-overview { grid-template-columns: 1fr; }
  .pp-visitor-overview__media { max-width: 720px; margin: 0 auto; }
  .pp-implementation-cards.pp-strengths-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .pp-visitor-overview { gap: 26px; margin-top: 28px; }
  .pp-visitor-overview__content p { font-size: 1rem; }
  #features .pp-capabilities-grid { grid-template-columns: 1fr; gap: 18px; }
  #features .pp-capability__media { height: 190px; }
  #features .pp-capability__body { padding: 22px 20px 24px; }
  #flow .pp-flow-list .pp-flow-row { grid-template-columns: 58px 12px minmax(0, 1fr); }
  #flow .pp-flow-list .pp-flow-row:not(:last-child)::before { left: 28px; }
  #flow .pp-flow-list .pp-flow-row::after { left: 70px; }
  #flow .pp-flow-list .pp-flow-row__step { width: 58px; height: 58px; border-width: 4px; font-size: 19px; }
  #flow .pp-flow-list .pp-flow-row__media { height: 142px; border-radius: 18px 18px 0 0; }
  #flow .pp-flow-list .pp-flow-row__media img { width: 104px; height: 104px; }
  .pp-service-comparison__scroll { margin-right: -16px; border-radius: 14px 0 0 14px; }
  .pp-service-comparison { min-width: 680px; font-size: .95rem; }
  .pp-service-comparison th,
  .pp-service-comparison td { padding: 13px 14px; }
  .pp-service-comparison tbody th { position: sticky; left: 0; z-index: 1; min-width: 170px; }
  .pp-service-comparison__summary { padding: 22px 20px; }
  .pp-service-comparison__summary h3,
  .pp-implementation-cards .pp-strength-card__title,
  .pp-qr-pricing__group h3 { font-size: 20px; }
  .pp-implementation-cards.pp-strengths-grid,
  .pp-qr-pricing { grid-template-columns: 1fr; gap: 16px; }
  .pp-implementation-cards .pp-strength-card,
  .pp-qr-pricing__price,
  .pp-qr-pricing__group { padding: 22px 20px; }
  .pp-qr-pricing__actions { flex-direction: column; }
}
