/*
 * WAP peptide-page.css — the .pp-* / .wap-faq classes the peptide & comparison
 * designs rely on (ported so pages pixel-match). Loaded only on peptide-single
 * + comparison-single templates. (WAP-DS-003 Phase 4.)
 */

section[id^="s-"] { scroll-margin-top: 150px; }

.pp-h1 { font-family: 'Newsreader', Georgia, serif; }
.pp-h2 { font-family: 'Newsreader', Georgia, serif; font-weight: 600; letter-spacing: -0.01em; color: #0E2A47; }

.pp-cite { font-size: 0.72em; font-weight: 700; color: #1FA89B; vertical-align: super; margin-left: 1px; text-decoration: none; }

.pp-card { transition: transform .28s ease, box-shadow .28s ease; }
.pp-card:hover { transform: translateY(-4px); box-shadow: rgba(24,31,56,0.25) 0 25px 45px -45px, rgba(24,31,56,0.10) 0 12px 28px -16px; }

.pp-toc { position: sticky; top: 96px; align-self: start; display: flex; flex-direction: column; gap: 2px; }
.pp-toc-link { font-size: 14px; font-weight: 500; color: #657694; padding: 8px 14px; border-left: 2px solid #e3e9f0; cursor: pointer; transition: color .2s, border-color .2s; }
.pp-toc-link.active { color: #0E2A47; font-weight: 600; border-left-color: #34D399; }

.pp-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 14px; border: 1px solid #e3e9f0; margin-bottom: 14px; }
.pp-cmp { width: 100%; border-collapse: collapse; font-size: 15px; min-width: 580px; }
.pp-cmp th, .pp-cmp td { padding: 14px 16px; text-align: left; vertical-align: top; border-bottom: 1px solid #e3e9f0; }
.pp-cmp thead th { background: #0E2A47; color: #ffffff; font-weight: 600; font-family: 'Newsreader', serif; font-size: 16px; }
.pp-cmp tbody th { background: #f2f5fa; color: #0E2A47; font-weight: 600; width: 30%; font-family: 'Inter', sans-serif; font-size: 14px; }
.pp-cmp tbody td { color: #2b3a57; line-height: 1.5; }
.pp-cmp tbody tr:last-child th, .pp-cmp tbody tr:last-child td { border-bottom: none; }

html.wap-js .pp-reveal.pp-reveal--armed { opacity: 0; transform: translateY(18px); transition: opacity .6s cubic-bezier(.22,.61,.36,1), transform .6s cubic-bezier(.22,.61,.36,1); }
html.wap-js .pp-reveal.pp-reveal--armed.in { opacity: 1; transform: none; }

.wap-faq__item summary { list-style: none; }
.wap-faq__item summary::-webkit-details-marker { display: none; }
.wap-faq__panel { overflow: hidden; transition: max-height .35s ease; }

@media (max-width: 920px) {
	.pp-grid { grid-template-columns: 1fr !important; gap: 8px !important; }
	.pp-toc { position: sticky; top: 64px; flex-direction: row; overflow-x: auto; gap: 6px; background: rgba(255,255,255,0.95); backdrop-filter: blur(8px); padding: 10px 0; z-index: 18; scrollbar-width: none; }
	.pp-toc::-webkit-scrollbar { display: none; }
	.pp-toc-link { border-left: none; border-bottom: 2px solid #e3e9f0; white-space: nowrap; flex: none; }
	.pp-toc-link.active { border-left: none; border-bottom-color: #34D399; }
	.pp-h1 { font-size: 34px !important; }
}

@media (prefers-reduced-motion: reduce) {
	html.wap-js .pp-reveal.pp-reveal--armed { opacity: 1 !important; transform: none !important; transition: none !important; }
	.pp-card:hover { transform: none !important; }
	.wap-faq__panel { transition: none !important; }
}