/* PG Triptych — scoped to .pg-triptych. Ported from DRobb .triptych. */
.pg-triptych{ padding:96px 56px 200px; background:var(--pg-bone); }
.pg-triptych .container{ max-width:1320px; margin:0 auto; }
.pg-triptych .head-meta{ display:grid; grid-template-columns:1fr 1fr 1fr; align-items:baseline; border-bottom:1px solid var(--pg-ink-thread); padding-bottom:20px; margin-bottom:72px; font-family:var(--pg-font-sans); font-weight:300; text-transform:uppercase; letter-spacing:.32em; font-size:11px; color:var(--pg-ink-soft); }
.pg-triptych .head-meta > :nth-child(1){ text-align:left; }
.pg-triptych .head-meta > :nth-child(2){ text-align:center; }
.pg-triptych .head-meta > :nth-child(3){ text-align:right; }
.pg-triptych .head-meta em{ font-family:var(--pg-font-italic); font-style:italic; text-transform:none; letter-spacing:0; font-size:19px; color:var(--pg-terracotta); }
.pg-triptych .spread{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:0; border:1px solid var(--pg-ink-thread); }
.pg-triptych .panel{ padding:64px 48px; border-right:1px solid var(--pg-ink-thread); display:flex; flex-direction:column; position:relative; }
.pg-triptych .panel:last-child{ border-right:0; }
.pg-triptych .panel:nth-child(1){ background:var(--pg-bone); }
.pg-triptych .panel:nth-child(2){ background:var(--pg-bone-soft); }
.pg-triptych .panel:nth-child(3){ background:var(--pg-bone-warm); }
.pg-triptych .panel .num-row{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:32px; }
.pg-triptych .panel .num{ font-family:var(--pg-font-display); font-weight:300; font-style:italic; font-size:clamp(54px,5.2vw,80px); line-height:.9; color:var(--pg-teal); }
.pg-triptych .panel .acc{ font-family:var(--pg-font-sans); font-weight:300; text-transform:uppercase; letter-spacing:.32em; font-size:10px; color:var(--pg-ink-pale); text-align:right; }
.pg-triptych .panel .acc em{ font-family:var(--pg-font-italic); font-style:italic; text-transform:none; letter-spacing:0; font-size:14px; color:var(--pg-ink); display:block; margin-top:6px; }
.pg-triptych .panel h3{ font-family:var(--pg-font-display); font-weight:300; font-variation-settings:"opsz" 144; font-size:clamp(40px,4.4vw,62px); line-height:1.04; letter-spacing:-.018em; text-transform:lowercase; color:var(--pg-ink); margin-bottom:32px; max-width:10ch; }
.pg-triptych .panel h3 em{ font-style:italic; color:var(--pg-terracotta); }
.pg-triptych .panel .ornament{ width:60px; height:1px; background:var(--pg-ink-thread); position:relative; margin-bottom:28px; }
.pg-triptych .panel .ornament::before{ content:'✦'; position:absolute; top:-10px; left:0; background:inherit; padding-right:8px; font-size:13px; color:var(--pg-terracotta); }
.pg-triptych .panel:nth-child(1) .ornament::before{ background:var(--pg-bone); }
.pg-triptych .panel:nth-child(2) .ornament::before{ background:var(--pg-bone-soft); }
.pg-triptych .panel:nth-child(3) .ornament::before{ background:var(--pg-bone-warm); }
.pg-triptych .panel p{ font-family:var(--pg-font-italic); font-size:23px; line-height:1.56; color:var(--pg-ink); margin-bottom:1.1em; }
.pg-triptych .panel p:last-child{ margin-bottom:0; }
.pg-triptych .panel p em{ font-style:italic; color:var(--pg-terracotta); }
.pg-triptych .panel p strong{ font-weight:400; font-style:italic; background:linear-gradient(transparent 64%, rgba(200,146,61,.22) 64%); padding:0 2px; }
.pg-triptych .closing{ margin-top:80px; text-align:center; padding:40px 0; border-top:1px solid var(--pg-ink-thread); }
.pg-triptych .closing p{ font-family:var(--pg-font-display); font-weight:300; font-style:italic; font-variation-settings:"opsz" 144; font-size:clamp(36px,4.2vw,56px); line-height:1.18; letter-spacing:-.014em; color:var(--pg-ink); max-width:32ch; margin:0 auto; clip-path:inset(0 100% 0 0); padding:8px 0; transition:clip-path 1500ms var(--pg-ease) 400ms; }
.pg-triptych .closing.pg-in p{ clip-path:inset(0 0 0 0); }
.pg-triptych .closing p em{ color:var(--pg-terracotta); }
@media (prefers-reduced-motion: reduce){ .pg-triptych .closing p{ clip-path:none; } }
@media (max-width:880px){
  .pg-triptych{ padding:64px 24px 110px; }
  .pg-triptych .head-meta{ grid-template-columns:1fr; gap:6px; }
  .pg-triptych .head-meta > :nth-child(2), .pg-triptych .head-meta > :nth-child(3){ text-align:left; }
  .pg-triptych .spread{ grid-template-columns:1fr; }
  .pg-triptych .panel{ border-right:0; border-bottom:1px solid var(--pg-ink-thread); }
  .pg-triptych .panel:last-child{ border-bottom:0; }
}
