/* Project page (/projects/<slug>/). Loaded after dataintell-marketing.css
   and dataintell-tools.css; every rule is scoped under .pp. */

/* ── header ─────────────────────────────────────────────── */
.pp-head { position: relative; overflow: hidden; background: var(--ink); color: var(--paper); padding: 118px 0 40px; }
.pp-head::before { content: ""; position: absolute; right: -160px; top: -200px; width: 640px; height: 640px; border-radius: 50%; background: radial-gradient(circle, rgba(123,30,122,.42), rgba(23,17,28,0) 65%); pointer-events: none; }
.pp-head .dm-shell { position: relative; z-index: 1; }
.pp-tags { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; padding: 0; }
.pp-tag { padding: 6px 10px; border-radius: 4px; border: 1px solid rgba(251,249,252,.22); color: rgba(251,249,252,.85); font-family: var(--dm-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.pp-tag--gold { border-color: rgba(214,169,74,.5); color: var(--seal); }
.pp-tag--teal { border-color: rgba(61,181,181,.5); color: #7FD6D6; }
.pp-title { max-width: 920px; margin: 0 0 22px; font-family: var(--dm-display); font-weight: 400; font-size: clamp(36px, 5vw, 64px); line-height: 1.03; letter-spacing: -.02em; }
.pp-by { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-bottom: 26px; font-size: 15px; line-height: 1.45; }
.pp-by a { color: var(--paper); font-weight: 600; }
.pp-by a:hover { color: var(--orchid); }
.pp-dim { color: rgba(251,249,252,.72); }
.pp-dates { font-family: var(--dm-mono); font-size: 12px; color: rgba(251,249,252,.72); }
.pp-faces { display: flex; }
.pp-faces .pp-avatar { width: 40px; height: 40px; border: 2px solid var(--ink); }
.pp-faces .pp-avatar + .pp-avatar { margin-left: -10px; }
.pp-stats { display: flex; flex-wrap: wrap; margin: 0 0 28px; border-top: 1px solid var(--line-dk); }
.pp-stats div { flex: 1 1 130px; padding: 18px 20px 0 0; }
.pp-stats dt { margin: 0 0 4px; font-family: var(--dm-mono); font-size: 11px; font-weight: 400; letter-spacing: .18em; text-transform: uppercase; color: rgba(251,249,252,.62); }
.pp-stats dd { margin: 0; font-family: var(--dm-display); font-size: 34px; line-height: 1; }
.pp-stats small { font-size: 16px; color: rgba(251,249,252,.62); }
.pp-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.pp-acts .dm-btn { font: inherit; font-size: 15px; font-weight: 600; }
.pp-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-left: auto; }
.pp-ico { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 8px; border: 1px solid rgba(251,249,252,.22); background: transparent; color: var(--paper); cursor: pointer; transition: border-color .2s, color .2s; }
.pp-ico:hover { border-color: var(--orchid); color: var(--orchid); }
.pp-copied { font-size: 13px; color: #7FD6D6; }
.pp-feature { display: block; width: 100%; max-height: 420px; margin-top: 32px; border-radius: 12px; object-fit: cover; }

/* ── people ─────────────────────────────────────────────── */
.pp-avatar { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 36px; height: 36px; border-radius: 50%; object-fit: cover; background: var(--plum); color: #fff; font-weight: 600; font-size: 15px; }
.pp-avatar--lg { width: 76px; height: 76px; font-family: var(--dm-display); font-weight: 400; font-size: 36px; }

/* ── body ───────────────────────────────────────────────── */
.pp-body { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 40px; padding-top: 16px; padding-bottom: 88px; }
.pp-toc { position: sticky; top: 90px; flex: 0 0 180px; padding-top: 40px; }
.pp-toc a { display: block; padding: 8px 12px; border-radius: 6px; color: var(--slate); font-size: 14px; }
.pp-toc a:hover { background: var(--mist); color: var(--ink); }
.pp-toc a[aria-current="true"] { background: var(--ink); color: var(--paper); }
.pp-main { flex: 999 1 520px; min-width: 0; }
.pp-side { flex: 1 1 300px; max-width: 340px; display: flex; flex-direction: column; gap: 16px; padding-top: 40px; }

.pp-k { margin: 0 0 10px; font-family: var(--dm-mono); font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--plum); }
.pp-k--teal { color: #0A7373; }
.pp-k--gold { color: var(--seal); }
.pp-sec { padding: 40px 0; border-top: 1px solid rgba(23,17,28,.1); scroll-margin-top: 90px; }
.pp-sec:first-child { border-top: 0; }
.pp-sec__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 12px; margin-bottom: 20px; }
.pp-sec__head .pp-h2 { margin: 0; }
.pp-h2 { margin: 0 0 18px; font-family: var(--dm-display); font-weight: 400; font-size: 38px; line-height: 1.05; }
.pp-h2 em { font-style: italic; color: var(--plum); }
.pp-h3 { margin: 26px 0 8px; font-size: 17px; font-weight: 600; }
.pp-prose { max-width: 68ch; font-size: 17px; line-height: 1.7; color: #2C2136; overflow-wrap: anywhere; }
.pp-prose p { margin: 0 0 12px; }
.pp-limits { padding: 14px 18px; border-radius: 10px; background: #FDF5E3; }
.pp-empty { color: var(--slate); font-style: italic; }
.pp-total { margin: 0; font-family: var(--dm-display); font-size: 52px; line-height: 1; color: var(--plum); }
.pp-total small { font-size: 22px; color: var(--slate); }

.pp-dims { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.pp-u { padding: 20px; border: 1px solid rgba(23,17,28,.1); border-radius: 12px; background: #fff; }
.pp-u__head { display: flex; justify-content: space-between; margin-bottom: 8px; font-weight: 600; }
.pp-u__head b { color: var(--plum); }
.pp-u p { margin: 10px 0 0; font-size: 14px; line-height: 1.55; color: var(--slate); }
.pp-bar { height: 6px; border-radius: 3px; background: var(--mist); overflow: hidden; }
.pp-bar span { display: block; height: 100%; background: var(--plum); }
.pp-cites { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0; padding: 0; }
.pp-cite { padding: 3px 10px; border-radius: 999px; border: 1px solid rgba(23,17,28,.15); font-size: 12px; color: var(--slate); }
.pp-cite a { color: inherit; }
.pp-cite--tier1 { border-color: #C9A84C; color: #7A5A0A; }
.pp-cite--tier2 { border-color: #0A7373; color: #0A7373; }
.pp-cite--tier3 { border-color: var(--plum); color: var(--plum); }
.pp-note { margin-top: 16px; padding: 14px 18px; border-radius: 10px; background: var(--mist); font-size: 14px; color: var(--slate); }
.pp-note p { margin: 0 0 4px; }

.pp-figure { margin: 20px 0 0; padding: 16px; border-radius: 12px; background: var(--mist); text-align: center; }
.pp-figure img { max-width: 100%; border-radius: 8px; }
.pp-figure figcaption { margin-top: 8px; font-size: 13px; color: var(--slate); }
.pp-links { display: flex; flex-wrap: wrap; gap: 10px; }
.pp-links .dm-btn { padding: 11px 18px; font-size: 14px; }

.pp-product { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-top: 28px; padding: 24px; border-radius: 12px; background: var(--ink); color: var(--paper); }
.pp-product__logo { display: flex; align-items: center; justify-content: center; flex: none; width: 64px; height: 64px; border-radius: 12px; object-fit: contain; background: var(--plum); color: #fff; font-family: var(--dm-display); font-size: 34px; }
img.pp-product__logo { background: #fff; padding: 6px; }
.pp-product__in { flex: 1 1 260px; }
.pp-product .pp-k { color: var(--seal); }
.pp-product__t { margin: 0 0 4px; font-family: var(--dm-display); font-size: 28px; }
.pp-product__d { margin: 0; font-size: 14px; color: rgba(251,249,252,.75); }

/* validation */
.pp-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
.pp-card { padding: 20px; border: 1px solid rgba(23,17,28,.1); border-radius: 12px; background: #fff; }
.pp-card__v { margin: 0; font-weight: 600; }
.pp-card__v small { display: block; margin-top: 2px; font-weight: 400; font-size: 12px; color: var(--slate); }
.pp-card__big { margin: 0 0 8px; font-family: var(--dm-display); font-size: 32px; line-height: 1; }
.pp-card__d { margin: 6px 0 0; font-size: 13px; line-height: 1.5; color: var(--slate); }
.pp-v--gold { color: #8A5D0B; }
.pp-v--teal { color: #0A7373; }
.pp-v--blue { color: #1D4ED8; }
.pp-v--red { color: #B42318; }
.pp-meaning { margin-top: 18px; padding: 18px 20px; border-radius: 12px; background: var(--mist); }
.pp-meaning ul { margin: 0; padding-left: 18px; font-size: 15px; line-height: 1.6; color: #2C2136; }
.pp-reviews { margin-top: 18px; display: flex; flex-direction: column; gap: 10px; }

/* reactions */
.pp-react { display: flex; flex-wrap: wrap; gap: 8px; }
.pp-react__btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(23,17,28,.15); background: #fff; color: var(--ink); font: inherit; font-size: 14px; cursor: pointer; transition: border-color .2s; }
.pp-react__btn:hover { border-color: var(--plum); }
.pp-react__btn.active { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.pp-react__n { font-family: var(--dm-mono); font-size: 12px; color: var(--slate); }
.pp-react__btn.active .pp-react__n { color: var(--seal); }
.pp-react__total { margin: 12px 0 0; font-size: 14px; color: var(--slate); }
.pp-react__total a { color: var(--plum); font-weight: 600; }

.pp-related { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }

/* comments component, restyled for this page */
.pp .comments-section { margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
.pp .comments-header h4 { margin: 0 0 20px; font-family: var(--dm-display); font-weight: 400; font-size: 38px; color: var(--ink); }
.pp .comments-header h4 i { display: none; }
.pp .comment-form-wrapper { padding: 18px; border-radius: 12px; background: var(--mist); }
.pp .comment-textarea { border-radius: 8px; font-size: 15px; }
.pp .comments-section .btn-primary { background: var(--ink); border-color: var(--ink); border-radius: 6px; padding: 8px 18px; font-weight: 600; }
.pp .comment-signin-prompt { border-radius: 12px; background: var(--mist); }
.pp-discussion { scroll-margin-top: 90px; }

/* ── sidebar ────────────────────────────────────────────── */
.pp-box { padding: 22px; border: 1px solid rgba(23,17,28,.1); border-radius: 12px; background: #fff; }
.pp-box--teal { border-color: rgba(10,115,115,.4); }
.pp-box--ink { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.pp-box--own { border-style: dashed; border-color: rgba(23,17,28,.25); }
.pp-box__p { margin: 0 0 12px; font-size: 14px; line-height: 1.55; }
.pp-small { margin: 4px 0 0; font-size: 12px; color: var(--slate); }
.pp-sub { margin: 18px 0 8px; font-size: 13px; font-weight: 600; color: var(--slate); }
.pp-sub:first-of-type { margin-top: 4px; }
.pp-full { width: 100%; justify-content: center; }
.pp-box .dm-btn { padding: 11px 16px; font: inherit; font-size: 14px; font-weight: 600; }
.pp-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pp-row form { margin: 0; }
.pp-danger { color: #B42318; }
.pp-danger:hover { border-color: #B42318; color: #B42318; }
.pp-author { text-align: center; }
.pp-author .pp-avatar { margin: 0 auto 12px; }
.pp-author__name { margin: 0; font-size: 17px; font-weight: 600; }
.pp-author__meta { margin: 2px 0 12px; font-size: 14px; color: var(--slate); }
.pp-author__bio { margin: 0 0 14px; font-size: 14px; line-height: 1.55; text-align: left; }
.pp-people { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.pp-people li { display: flex; align-items: center; gap: 10px; }
.pp-people a { display: block; color: var(--ink); font-weight: 600; font-size: 15px; }
.pp-people a:hover { color: var(--plum); }
.pp-people small { font-size: 13px; color: var(--slate); }
.pp-lineage { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.pp-lineage a { color: var(--ink); font-weight: 600; font-size: 14px; }
.pp-lineage a:hover { color: var(--plum); }
.pp-lineage small { display: block; font-size: 12px; color: var(--slate); }
.pp-lineage small a { font-size: 12px; color: var(--plum); }
.pp-more { display: inline-block; margin-top: 10px; font-size: 14px; }
.pp-impact { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 16px; }
.pp-impact dt { font-size: 12px; font-weight: 400; color: rgba(251,249,252,.72); }
.pp-impact dd { margin: 0; font-family: var(--dm-display); font-size: 28px; }
.pp-invite { margin-top: 10px; padding: 12px; border-radius: 10px; background: var(--mist); font-size: 14px; }
.pp-invite__head { display: flex; justify-content: space-between; gap: 8px; margin: 0; }
.pp-invite__state { font-family: var(--dm-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--slate); }
.pp-details { margin: 8px 0; }
.pp-details summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--plum); }
.pp-details .ci-fld { flex: 1 1 160px; min-height: 40px; padding: 8px 10px; font-size: 14px; }
.pp-invite form button { margin-top: 6px; }

/* ongoing research page */
.pp-hash { display: block; margin: 10px 0 4px; font-size: 12px; color: var(--plum); overflow-wrap: anywhere; }
.pp-facts { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 16px; margin: 0; font-size: 14px; }
.pp-facts dt { font-weight: 400; color: var(--slate); }
.pp-facts dd { margin: 0; font-weight: 600; text-align: right; }
.pp-stack { display: flex; flex-direction: column; gap: 10px; }
.pp-option { display: flex; flex-direction: column; gap: 6px; padding: 16px; border: 1px solid rgba(23,17,28,.15); border-radius: 12px; color: var(--ink); font-size: 14px; }
.pp-option span { color: var(--slate); }
a.pp-option:hover { border-color: var(--plum); color: var(--ink); }
.pp-option .ci-lbl { margin: 6px 0 0; }

/* profiles (researchers and speakers) */
.pp-avatar--xl { width: 112px; height: 112px; font-family: var(--dm-display); font-weight: 400; font-size: 52px; border: 3px solid rgba(251,249,252,.2); }
.pf-head { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 28px; margin-bottom: 26px; }
.pf-head__text { flex: 1 1 320px; min-width: 0; }
.pf-head .pp-title { margin-bottom: 8px; }
.pf-meta { margin: 0; font-size: 15px; }
.sp-photo { display: flex; align-items: center; justify-content: center; flex: none; width: 140px; height: 172px; border-radius: 14px; object-fit: cover; border: 3px solid rgba(251,249,252,.15); background: var(--plum); color: #fff; font-family: var(--dm-display); font-size: 60px; }
.pp-stats dt a { color: inherit; }
.pp-stats dt a:hover { color: var(--orchid); }

/* collaboration request dialog */
.pp-modal { border-radius: 12px; font-family: var(--dm-body); }
.pp-modal .modal-title { font-family: var(--dm-display); font-weight: 400; font-size: 28px; }
.pp-modal .ci-lbl { margin-top: 14px; }
.pp-modal__about { margin: 0; padding: 12px 14px; border-radius: 8px; background: var(--mist); font-size: 14px; }

/* ── phones and tablets ─────────────────────────────────── */
@media (max-width: 991.98px) {
  .pp-head { padding-top: 100px; }
  .pp-share { margin-left: 0; }
  .pp-toc { position: sticky; top: 64px; z-index: 5; flex: 1 1 100%; display: flex; gap: 8px; overflow-x: auto; margin: 0 calc(-1 * var(--dm-gut)); padding: 12px var(--dm-gut); background: var(--paper); border-bottom: 1px solid var(--line); }
  .pp-toc .pp-k { display: none; }
  .pp-toc a { flex: none; padding: 6px 12px; border: 1px solid rgba(23,17,28,.15); border-radius: 999px; white-space: nowrap; }
  .pp-side { max-width: none; padding-top: 0; }
  .pp-sec { scroll-margin-top: 130px; }
  .pp-h2 { font-size: 32px; }
}