/* PRO: official feature imagery and seven-model comparison. */
.pro-features { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px 28px; }
.pro-feature-image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1280 / 853;
  object-fit: contain;
  background: #f7f7f7;
  margin-bottom: 18px;
}
.pro-features .feat-card h4 { font-size: 18px; line-height: 1.4; }
.pro-features .feat-card p { font-size: 15px; line-height: 1.8; }
.pro-feature-note { margin-top: 32px; padding: 22px 26px; background: #f4f7f8; border-left: 3px solid var(--red); }
.pro-feature-note h4 { margin-bottom: 8px; font-size: 18px; color: var(--heading); }
.pro-specifications { scroll-margin-top: 180px; }
.pro-spec-table-wrap { width: 100%; min-width: 0; border: 1px solid #d8e2e6; }
.pro-spec-table { width: 100%; min-width: 0; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: clamp(12px, .95vw, 14px); line-height: 1.55; }
.pro-spec-table th, .pro-spec-table td { padding: 11px 10px; vertical-align: top; text-align: left; border-bottom: 1px solid #dce5e9; border-right: 1px solid #e8edef; font-weight: 400; overflow-wrap: anywhere; }
.pro-spec-table thead th { background: #173443; color: #fff; font-weight: 700; vertical-align: middle; font-size: clamp(12px, 1vw, 14px); }
.pro-spec-table thead th span { display: block; font-size: 11px; letter-spacing: .1em; opacity: .7; margin-bottom: 4px; }
.pro-spec-table tr>:first-child { width: clamp(100px, 8.4vw, 124px); font-weight: 700; color: #173443; }
.pro-spec-table thead th:first-child { color: #fff; }
.pro-spec-table tbody tr:nth-child(odd)>* { background: #f2f6f8; }
.pro-spec-table tbody tr:nth-child(even)>* { background: #fff; }
.pro-spec-table tbody tr:hover>* { background: #eaf2f5; }
.pro-spec-key-row td { color: #173443; font-weight: 700; }
.pro-spec-primary, .pro-spec-group { display: block; }
.pro-spec-table small, .pro-spec-card small { display: block; font-size: 12px; color: #67808e; }
.pro-spec-group+ .pro-spec-group { margin-top: 12px; padding-top: 12px; border-top: 1px solid #d7e2e7; }
.pro-spec-group b { display: block; font-size: 11px; font-weight: 700; letter-spacing: .02em; color: #466878; margin-bottom: 3px; }
.pro-spec-cards { display: none; }
.pro-spec-card { min-width: 0; border: 1px solid #d8e2e6; background: #fff; }
.pro-spec-card h4 { margin: 0; padding: 16px 18px; background: #173443; color: #fff; font-size: 18px; line-height: 1.4; }
.pro-spec-card h4>span { display: block; font-size: 11px; letter-spacing: .1em; opacity: .7; margin-bottom: 3px; }
.pro-spec-card dl { margin: 0; }
.pro-spec-item { display: grid; grid-template-columns: minmax(90px, 36%) minmax(0, 1fr); gap: 12px; padding: 13px 16px; border-bottom: 1px solid #dce5e9; font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.pro-spec-item:nth-child(odd) { background: #f2f6f8; }
.pro-spec-item:last-child { border-bottom: 0; }
.pro-spec-item dt { margin: 0; font-weight: 600; color: #173443; }
.pro-spec-item dd { margin: 0; min-width: 0; }
.pro-spec-item--key dd { font-weight: 700; color: #173443; }
.pro-spec-notes { margin: 16px 0 30px; font-size: 12px; color: #67808e; }
.pro-spec-notes p { margin: 6px 0; }
.pro-spec-notes a { color: #007089; }
.pro-product-codes { border-top: 1px solid #dce5e9; margin-top: 24px; }
.pro-product-codes summary { padding: 18px 0; font-weight: 700; color: #173443; cursor: pointer; }
.pro-specifications :focus-visible, .pro-product-codes summary:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; }
@media (max-width: 1024px) { .pro-features { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 980px) {
  .pro-spec-table-wrap { display: none; }
  .pro-spec-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
}
@media (max-width: 600px) {
  .pro-features { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .pro-specifications { scroll-margin-top: 150px; }
  .pro-spec-cards { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .pro-feature-note { padding: 20px; }
}
/* Compare the two constructions without an unused desktop column. */
.constr-list--paired {
  max-width: none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}
.constr-list--paired .constr-block.has-media {
  grid-template-columns: clamp(100px, 10vw, 160px) minmax(0, 1fr);
  gap: 20px;
  padding: 22px;
}
.constr-list--paired .constr-body { min-width: 0; }
.constr-list--paired .constr-media img {
  display: block;
  max-height: 240px;
  object-fit: contain;
  background: #fff;
}
@media (max-width: 980px) {
  .constr-list--paired { grid-template-columns: minmax(0, 1fr); }
  .constr-list--paired .constr-block.has-media {
    grid-template-columns: minmax(100px, 180px) minmax(0, 1fr);
  }
}
@media (max-width: 600px) {
  .constr-list--paired .constr-block.has-media {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    padding: 20px 18px;
  }
  .constr-list--paired .constr-media { width: 140px; margin: 0 auto; }
}