/* product-specs.css: component-owned rules. Shared priority order is declared in tokens.css. */
@layer presentation {
/* phase3 */
.p3-specs {
  padding: var(--space-50) 0 var(--space-68);
  margin: 0;
}

.p3-spec-heading {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7%;
  margin: 0 0 var(--space-30);
  align-items: start;
}

.p3-spec-heading h2 {
  font-size: var(--font-32);
  line-height: 1.6;
  margin: 0;
}

.p3-spec-heading p {
  margin: 0;
  max-width: 34em;
}

.p3-specs table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font: 400 var(--font-16)/1.9 var(--sans);
  letter-spacing: .01em;
}

.p3-specs caption {
  text-align: left;
  font-size: var(--font-14);
  color: var(--color-muted);
  margin-bottom: var(--space-14);
}

.p3-specs th,
.p3-specs td {
  padding: var(--space-18) var(--space-24);
  text-align: left;
  border-bottom: 1px solid var(--color-bac7cd);
  font-weight: 400;
  vertical-align: top;
}

.p3-specs thead {
  background: var(--color-edf1f0);
}

.p3-specs th:first-child {
  width: 30%;
}

.p3-specs td {
  color: var(--color-ink);
}

.p3-specs tbody th {
  font-weight: 500;
}

.p3-resources {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7%;
  margin-top: var(--space-40);
}

.p3-resources h3 {
  font-size: var(--font-23);
  margin: 0 0 var(--space-12);
}

.p3-resources p {
  line-height: 1.9;
  margin: 0 0 var(--space-20);
}

.p3-downloads {
  display: flex;
  gap: var(--space-12);
  flex-wrap: wrap;
}

.p3-downloads button {
  appearance: none;
  background: transparent;
  color: var(--color-ink);
  border: 1px solid var(--color-91a5af);
  padding: var(--space-13) var(--space-20);
  min-height: 48px;
  font: 500 var(--font-16)/1.5 var(--sans);
  cursor: pointer;
}

.p3-downloads button:hover {
  background: var(--color-edf1f0);
}

.p3-downloads button:disabled {
  cursor: default;
  color: var(--color-muted);
}

.p3-download-status {
  min-height: 2em;
}

.p3-sample .solid-link {
  display: flex;
  justify-content: space-between;
  min-height: 62px;
  max-width: 360px;
  width: 100%;
  font-size: var(--font-16);
}

.p3-product-sample {
  justify-content: space-between;
  gap: var(--space-28);
  border: 1px solid var(--color-91a5af);
  min-height: 54px;
  padding: var(--space-13) var(--space-20);
  margin-top: var(--space-16);
  color: var(--color-ink);
  text-decoration: none;
  background: var(--color-edf1f0);
  font: 500 var(--font-16)/1.7 var(--sans);
}

.p3-product-sample:hover {
  background: var(--color-d8e2e2);
}

.p3-specs :focus-visible,
.p3-product-sample:focus-visible {
  outline: 2px solid var(--color-ink);
  outline-offset: var(--space-5);
}

/* phase3 */
@media(max-width:900px) {
.p3-spec-heading,
.p3-resources {
  gap: 5%;
}
}

/* phase3 */
@media(max-width:700px) {
.p3-specs {
  padding: var(--space-35) 0 var(--space-44);
}

.p3-spec-heading,
.p3-resources {
  display: block;
}

.p3-spec-heading h2 {
  font-size: var(--font-27);
  margin-bottom: var(--space-20);
}

.p3-specs th,
.p3-specs td {
  padding: var(--space-15) var(--space-12);
  font-size: var(--font-16);
}

.p3-specs th:first-child {
  width: 42%;
}

.p3-resources {
  margin-top: var(--space-30);
}

.p3-sample {
  margin-top: var(--space-30);
}

.p3-downloads button {
  flex: 1;
  min-width: 120px;
}

.p3-sample .solid-link {
  max-width: none;
}

.p3-product-sample {
  width: 100%;
}
}

/* phase3 */
.p3-specs .p3-term {
  display: inline-block;
  white-space: nowrap;
}
}

@layer constraints {
/* phase3 */
.p3-spec-heading p {
  font-size: var(--font-16);
  line-height: 1.9;
}

.p3-resources p {
  font-size: var(--font-16);
}

.p3-download-status {
  font-size: var(--font-14);
  margin-top: var(--space-14);
}

.p3-product-sample {
  display: flex;
}

/* phase3 */
@media(prefers-reduced-motion:reduce) {
.p3-specs *,
.p3-product-sample {
  animation: none;
  transition: none;
  scroll-behavior: auto;
}
}
}