#publisher-products {
  --pp-bg: #ffffff;
  --pp-bg-muted: #f5f7f6;
  --pp-text: #172322;
  --pp-muted: #596765;
  --pp-line: #d9dfdd;
  --pp-line-strong: #aeb9b6;
  --pp-accent: #087f78;
  --pp-accent-dark: #06645f;
  --pp-contact: #12312f;
  color: var(--pp-text);
  background: var(--pp-bg);
  font-family: 'DM Sans', 'Inter', system-ui, sans-serif;
}

html.dark #publisher-products {
  --pp-bg: #111918;
  --pp-bg-muted: #17211f;
  --pp-text: #edf3f1;
  --pp-muted: #a8b5b2;
  --pp-line: #34423f;
  --pp-line-strong: #5b6b67;
  --pp-accent: #64d8ce;
  --pp-accent-dark: #8ce9e1;
  --pp-contact: #0a2523;
}

#publisher-products *,
#publisher-products *::before,
#publisher-products *::after { box-sizing: border-box; }

#publisher-products a { color: inherit; }
#publisher-products .pp-wrap { width: min(1100px, calc(100% - 48px)); margin: 0 auto; }

#publisher-products .pp-context,
#publisher-products .pp-section-label {
  margin: 0;
  color: var(--pp-accent);
  font-size: .92rem;
  font-weight: 700;
}

#publisher-products .pp-intro {
  padding: 76px 0 0;
  border-bottom: 1px solid var(--pp-line);
}

#publisher-products .pp-intro-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(330px, .82fr);
  gap: clamp(52px, 8vw, 96px);
  align-items: start;
  padding: 18px 0 62px;
}

#publisher-products h1,
#publisher-products h2,
#publisher-products h3,
#publisher-products p { text-wrap: pretty; }

#publisher-products .pp-intro-copy h1 {
  max-width: 720px;
  margin: 0;
  font-size: clamp(2.8rem, 5.4vw, 4.5rem);
  font-weight: 650;
  line-height: 1.03;
  letter-spacing: -.045em;
}

#publisher-products .pp-lede {
  max-width: 680px;
  margin: 25px 0 0;
  color: var(--pp-muted);
  font-size: clamp(1.08rem, 1.7vw, 1.25rem);
  line-height: 1.6;
}

#publisher-products .pp-history-proof {
  margin: 17px 0 0;
  color: var(--pp-muted);
  font-size: .92rem;
}
#publisher-products .pp-history-proof strong { color: var(--pp-text); }

#publisher-products .pp-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px 24px;
  margin-top: 31px;
}

#publisher-products .pp-button {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 17px;
  border: 1px solid transparent;
  border-radius: 6px;
  font-size: .9rem;
  font-weight: 700;
  text-decoration: none;
  transition: background-color 140ms ease, border-color 140ms ease;
}

#publisher-products .pp-button-primary { color: #fff; background: var(--pp-accent-dark); }
#publisher-products .pp-button-primary:hover { background: #044e4a; }
html.dark #publisher-products .pp-button-primary { color: #102a28; background: var(--pp-accent); }
html.dark #publisher-products .pp-button-primary:hover { background: #8ce9e1; }

#publisher-products .pp-button:focus-visible,
#publisher-products a:focus-visible,
#publisher-products summary:focus-visible { outline: 3px solid #f0b429; outline-offset: 3px; }

#publisher-products .pp-text-link,
#publisher-products .pp-service > a {
  color: var(--pp-accent-dark);
  font-size: .9rem;
  font-weight: 700;
  text-decoration: none;
}

html.dark #publisher-products .pp-text-link,
html.dark #publisher-products .pp-service > a { color: var(--pp-accent); }
#publisher-products .pp-text-link:hover,
#publisher-products .pp-service > a:hover { text-decoration: underline; text-underline-offset: 3px; }

#publisher-products .pp-snapshot {
  padding: 23px 25px 21px;
  border: 1px solid var(--pp-line);
  border-top: 3px solid var(--pp-accent);
  background: var(--pp-bg-muted);
}

#publisher-products .pp-snapshot-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: baseline;
}

#publisher-products .pp-snapshot-head h2 { margin: 0; font-size: 1rem; font-weight: 700; }
#publisher-products .pp-snapshot-head span { color: var(--pp-muted); font-size: .72rem; white-space: nowrap; }
#publisher-products .pp-snapshot dl { margin: 21px 0 0; }
#publisher-products .pp-snapshot dl > div {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: baseline;
  padding: 14px 0;
  border-top: 1px solid var(--pp-line);
}
#publisher-products .pp-snapshot dt { color: var(--pp-muted); font-size: .84rem; }
#publisher-products .pp-snapshot dd { margin: 0; font-size: 1.08rem; font-weight: 700; white-space: nowrap; }
#publisher-products .pp-snapshot > p {
  margin: 12px 0 0;
  color: var(--pp-muted);
  font-size: .72rem;
  line-height: 1.55;
}

#publisher-products .pp-snapshot > p a,
#publisher-products .pp-principle-list a {
  color: var(--pp-accent-dark);
  font-weight: 700;
  text-underline-offset: 2px;
}
html.dark #publisher-products .pp-snapshot > p a,
html.dark #publisher-products .pp-principle-list a { color: var(--pp-accent); }

#publisher-products .pp-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  padding: 0;
  margin: 0;
  border-top: 1px solid var(--pp-line);
  list-style: none;
}

#publisher-products .pp-summary li {
  min-height: 92px;
  padding: 22px 24px 20px 0;
  border-right: 1px solid var(--pp-line);
}
#publisher-products .pp-summary li:not(:first-child) { padding-left: 24px; }
#publisher-products .pp-summary li:last-child { border-right: 0; }
#publisher-products .pp-summary strong { display: block; font-size: .9rem; }
#publisher-products .pp-summary span { display: block; margin-top: 5px; color: var(--pp-muted); font-size: .78rem; }

#publisher-products .pp-section { padding: clamp(66px, 8vw, 92px) 0; }
#publisher-products .pp-section + .pp-section { border-top: 1px solid var(--pp-line); }
#publisher-products .pp-section-muted { background: var(--pp-bg-muted); }

#publisher-products .pp-section-intro { max-width: 760px; }
#publisher-products .pp-section-intro h2,
#publisher-products .pp-principles > header h2,
#publisher-products .pp-questions header h2,
#publisher-products .pp-contact h2 {
  margin: 12px 0 0;
  font-size: clamp(2rem, 3.5vw, 2.75rem);
  font-weight: 650;
  line-height: 1.12;
  letter-spacing: -.035em;
}
#publisher-products .pp-section-intro > p:last-child {
  max-width: 690px;
  margin: 19px 0 0;
  color: var(--pp-muted);
  line-height: 1.65;
}
#publisher-products .pp-section-intro-compact { max-width: 690px; }

#publisher-products .pp-service-list { margin-top: 44px; border-top: 1px solid var(--pp-line-strong); }
#publisher-products .pp-service {
  display: grid;
  grid-template-columns: minmax(180px, .68fr) minmax(380px, 1.45fr) minmax(150px, .55fr);
  gap: 34px;
  align-items: start;
  padding: 34px 0 36px;
  border-bottom: 1px solid var(--pp-line);
}
#publisher-products .pp-service-name h3 { margin: 0; font-size: 1.15rem; font-weight: 700; }
#publisher-products .pp-service-name p { margin: 8px 0 0; color: var(--pp-accent); font-size: .84rem; font-weight: 700; }
#publisher-products .pp-service-description > p { max-width: 620px; margin: 0; color: var(--pp-muted); line-height: 1.6; }
#publisher-products .pp-service-description ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 24px;
  padding-left: 18px;
  margin: 17px 0 0;
  color: var(--pp-text);
  font-size: .84rem;
  line-height: 1.5;
}
#publisher-products .pp-service > a { justify-self: end; margin-top: 1px; text-align: right; }

#publisher-products .pp-table-wrap { margin-top: 42px; border-top: 1px solid var(--pp-line-strong); }
#publisher-products .pp-format-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
#publisher-products .pp-format-table th {
  padding: 13px 18px 13px 0;
  color: var(--pp-muted);
  font-size: .75rem;
  font-weight: 700;
  text-align: left;
}
#publisher-products .pp-format-table th:first-child { width: 42%; }
#publisher-products .pp-format-table th:nth-child(2) { width: 20%; }
#publisher-products .pp-format-table td {
  padding: 20px 18px 20px 0;
  border-top: 1px solid var(--pp-line);
  vertical-align: top;
  font-size: .88rem;
  line-height: 1.5;
}
#publisher-products .pp-format-table td:last-child { color: var(--pp-muted); }
#publisher-products .pp-format-table strong { display: block; font-weight: 700; }
#publisher-products .pp-format-link,
#publisher-products .pp-endpoint-link { display: block; color: inherit; text-decoration: none; }
#publisher-products .pp-format-link:hover strong,
#publisher-products .pp-endpoint-link:hover code { text-decoration: underline; text-underline-offset: 3px; }
#publisher-products .pp-format-table code {
  display: block;
  margin-top: 5px;
  color: var(--pp-muted);
  font: 400 .72rem/1.5 'JetBrains Mono', monospace;
  overflow-wrap: anywhere;
}

#publisher-products .pp-support-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 50px;
  border-top: 1px solid var(--pp-line-strong);
}
#publisher-products .pp-support-grid > div { padding: 25px 30px 0 0; }
#publisher-products .pp-support-grid > div + div { padding-left: 30px; border-left: 1px solid var(--pp-line); }
#publisher-products .pp-support-grid h3 { margin: 0; font-size: .95rem; }
#publisher-products .pp-support-grid p { margin: 9px 0 0; color: var(--pp-muted); font-size: .84rem; line-height: 1.6; }

#publisher-products .pp-principles {
  display: grid;
  grid-template-columns: minmax(250px, .78fr) minmax(0, 1.22fr);
  gap: clamp(50px, 8vw, 96px);
  padding-top: 8px;
}
#publisher-products .pp-principles > header { padding-top: 25px; border-top: 3px solid var(--pp-text); }
#publisher-products .pp-principles > header > p:last-child { margin: 19px 0 0; color: var(--pp-muted); line-height: 1.65; }
#publisher-products .pp-principle-list { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--pp-line-strong); }
#publisher-products .pp-principle-list > div { min-height: 155px; padding: 24px 25px 24px 0; border-bottom: 1px solid var(--pp-line); }
#publisher-products .pp-principle-list > div:nth-child(even) { padding-left: 25px; border-left: 1px solid var(--pp-line); }
#publisher-products .pp-principle-list h3 { margin: 0; font-size: .94rem; }
#publisher-products .pp-principle-list p { margin: 9px 0 0; color: var(--pp-muted); font-size: .83rem; line-height: 1.62; }

#publisher-products .pp-questions-section { background: var(--pp-bg-muted); }
#publisher-products .pp-questions {
  display: grid;
  grid-template-columns: minmax(230px, .7fr) minmax(0, 1.3fr);
  gap: clamp(48px, 8vw, 94px);
}
#publisher-products .pp-questions dl { margin: 0; border-top: 1px solid var(--pp-line-strong); }
#publisher-products .pp-questions dl > div { padding: 23px 0; border-bottom: 1px solid var(--pp-line); }
#publisher-products .pp-questions dt { font-size: .95rem; font-weight: 700; }
#publisher-products .pp-questions dd { margin: 8px 0 0; color: var(--pp-muted); font-size: .86rem; line-height: 1.62; }

#publisher-products .pp-contact { color: #f3f7f6; background: var(--pp-contact); }
#publisher-products .pp-contact-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 48px;
  align-items: center;
  padding-top: 56px;
  padding-bottom: 58px;
}
#publisher-products .pp-contact .pp-section-label { color: #8bd9d2; }
#publisher-products .pp-contact h2 { font-size: clamp(1.9rem, 3vw, 2.5rem); }
#publisher-products .pp-contact p:last-child { margin: 12px 0 0; color: #bdcac7; font-size: .9rem; }
#publisher-products .pp-contact .pp-button-primary { color: #12312f; background: #f3f7f6; }
#publisher-products .pp-contact .pp-button-primary:hover { background: #dce8e5; }

@media (max-width: 900px) {
  #publisher-products .pp-intro-grid,
  #publisher-products .pp-principles,
  #publisher-products .pp-questions { grid-template-columns: 1fr; }
  #publisher-products .pp-snapshot { max-width: 580px; }
  #publisher-products .pp-service { grid-template-columns: minmax(160px, .55fr) minmax(0, 1.45fr); }
  #publisher-products .pp-service > a { grid-column: 2; justify-self: start; text-align: left; }
  #publisher-products .pp-support-grid { grid-template-columns: 1fr; }
  #publisher-products .pp-support-grid > div { padding: 21px 0; border-bottom: 1px solid var(--pp-line); }
  #publisher-products .pp-support-grid > div + div { padding-left: 0; border-left: 0; }
}

@media (max-width: 680px) {
  #publisher-products .pp-wrap { width: min(100% - 32px, 1100px); }
  #publisher-products .pp-intro { padding-top: 52px; }
  #publisher-products .pp-intro-grid { gap: 38px; padding: 14px 0 46px; }
  #publisher-products .pp-intro-copy h1 { font-size: clamp(2.45rem, 12vw, 3.35rem); }
  #publisher-products .pp-lede { font-size: 1.04rem; }
  #publisher-products .pp-actions { align-items: flex-start; flex-direction: column; }
  #publisher-products .pp-button { width: 100%; }
  #publisher-products .pp-snapshot > p a,
#publisher-products .pp-principle-list a {
  color: var(--pp-accent-dark);
  font-weight: 700;
  text-underline-offset: 2px;
}
html.dark #publisher-products .pp-snapshot > p a,
html.dark #publisher-products .pp-principle-list a { color: var(--pp-accent); }

#publisher-products .pp-summary { grid-template-columns: repeat(2, 1fr); }
  #publisher-products .pp-summary li { padding: 19px 14px 18px 0; border-bottom: 1px solid var(--pp-line); }
  #publisher-products .pp-summary li:nth-child(even) { padding-left: 18px; border-right: 0; }
  #publisher-products .pp-summary li:nth-child(n+3) { border-bottom: 0; }
  #publisher-products .pp-section { padding: 60px 0; }
  #publisher-products .pp-section-intro h2,
  #publisher-products .pp-principles > header h2,
  #publisher-products .pp-questions header h2 { font-size: 2rem; }
  #publisher-products .pp-service { grid-template-columns: 1fr; gap: 20px; padding: 29px 0; }
  #publisher-products .pp-service-description ul { grid-template-columns: 1fr; }
  #publisher-products .pp-service > a { grid-column: auto; }
  #publisher-products .pp-format-table,
  #publisher-products .pp-format-table tbody,
  #publisher-products .pp-format-table tr,
  #publisher-products .pp-format-table td { display: block; width: 100%; }
  #publisher-products .pp-format-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  #publisher-products .pp-format-table tr { padding: 20px 0; border-top: 1px solid var(--pp-line); }
  #publisher-products .pp-format-table td { padding: 0; border: 0; }
  #publisher-products .pp-format-table td + td { margin-top: 11px; }
  #publisher-products .pp-format-table td:nth-child(2)::before,
  #publisher-products .pp-format-table td:nth-child(3)::before { display: block; color: var(--pp-muted); font-size: .69rem; font-weight: 700; }
  #publisher-products .pp-format-table td:nth-child(2)::before { content: 'Delivery'; }
  #publisher-products .pp-format-table td:nth-child(3)::before { content: 'Typical use'; }
  #publisher-products .pp-principle-list { grid-template-columns: 1fr; }
  #publisher-products .pp-principle-list > div,
  #publisher-products .pp-principle-list > div:nth-child(even) { min-height: 0; padding: 21px 0; border-left: 0; }
  #publisher-products .pp-contact-inner { grid-template-columns: 1fr; gap: 28px; padding-top: 46px; padding-bottom: 48px; }
}

@media (prefers-reduced-motion: reduce) {
  #publisher-products .pp-button { transition: none; }
}
