/* Proof: Jerri story + 8 more (note 17, option 2) */
.proof-story{background:#0E0D0B;color:#F5F1EA;padding:110px 0 100px;border-top:1px solid #1f1f1f}
.proof-story .wrap{display:block!important;max-width:1180px;margin:0 auto;padding:0 32px}
.proof-story .breakout-h2{color:#F5F1EA}
.proof-story .breakout-h2 em{color:#F5F1EA}
.ps-top{display:flex;justify-content:space-between;align-items:flex-end;gap:48px}
.ps-lead{max-width:440px;margin:0 0 8px;font-size:17px;line-height:1.6;color:#bdb5a7}
.ps-lead em{font-family:Fraunces,Georgia,serif;font-style:italic;color:#F5F1EA}

.ps-card{margin-top:46px;display:grid;grid-template-columns:400px 1fr;border:1px solid #26221e;border-radius:24px;overflow:hidden;background:linear-gradient(180deg,#171512,#121010);box-shadow:0 40px 80px -48px rgba(0,0,0,.9)}
.ps-photo{position:relative;min-height:480px;background:#000;overflow:hidden}
.ps-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 35%;transition:transform 1.4s cubic-bezier(.16,1,.3,1)}
.ps-card:hover .ps-photo img{transform:scale(1.03)}
.ps-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 52%,rgba(14,13,11,.92))}
.ps-name{position:absolute;left:28px;bottom:26px;z-index:1}
.ps-name b{display:block;font:300 42px/1 Fraunces,Georgia,serif;letter-spacing:-.02em;color:#F5F1EA}
.ps-tag{display:inline-block;margin-top:12px;padding:5px 11px;border-radius:999px;background:rgba(232,87,74,.16);border:1px solid rgba(232,87,74,.4);color:#E8574A;font:600 10.5px 'JetBrains Mono',monospace;letter-spacing:.12em;text-transform:uppercase}

.ps-data{padding:38px 42px 32px;min-width:0}
.ps-long-num .ps-to{font-size:68px}
.ps-long-num .ps-from{font-size:32px}
.ps-label,.ps-metrics span,.ps-more-label{font:600 11px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#8a8276}
.ps-hero-n{display:flex;align-items:baseline;gap:16px;margin-top:14px;font-family:Inter,Arial,sans-serif;font-weight:600;letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.ps-from{font-size:40px;font-weight:500;color:#8a8276}
.ps-arrow{font-size:28px;font-weight:500;color:#E8574A}
.ps-to{font-size:96px;line-height:.9;color:#F5F1EA}
.ps-sub{margin-top:12px;font-size:15.5px;color:#bdb5a7}
.ps-sub b{color:#F5F1EA;font-weight:600}

.ps-chart{display:block;width:100%;height:170px;margin-top:24px;overflow:visible}
.ps-base{stroke:#2a2622}
.ps-line{fill:none;stroke:#F5F1EA;stroke-width:3;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:var(--ps-off,0);filter:drop-shadow(0 0 10px rgba(245,241,234,.22));transition:stroke-dashoffset 1.8s cubic-bezier(.4,0,.2,1)}
.ps-mark line{stroke-dasharray:3 4}
.ps-mark text{font:600 10.5px 'JetBrains Mono',monospace;letter-spacing:1.4px}
.ps-mark-flag line{stroke:#E8574A}.ps-mark-flag circle{fill:#E8574A}.ps-mark-flag text{fill:#E8574A}
.ps-mark-sign line{stroke:rgba(245,241,234,.5)}.ps-mark-sign text{fill:#F5F1EA}
.ps-mark{transition:opacity .6s}
.ps-end{fill:#E8574A}
.ps-end-ring{fill:rgba(232,87,74,.22);transform-box:fill-box;transform-origin:center;animation:ps-ping 2.4s ease-out infinite}
@keyframes ps-ping{0%{transform:scale(.5);opacity:1}80%,100%{transform:scale(1.7);opacity:0}}

.ps-metrics{display:grid;grid-template-columns:repeat(var(--ps-cols,3),1fr);margin-top:14px;border-top:1px solid #2a2622}
.ps-metrics div{padding-top:18px}
.ps-metrics b{display:block;margin-top:8px;font:600 26px Inter,Arial,sans-serif;letter-spacing:-.035em;color:#F5F1EA}
.ps-metrics i{font-style:normal;color:#E8574A;font-size:18px}

.ps-more{margin-top:26px}
.ps-more-label{line-height:1.6;margin-bottom:12px}
.ps-more-row{display:flex;align-items:center;gap:14px}
.ps-faces{display:flex;gap:8px;flex:1;min-width:0}
.ps-face b.ps-long{font-size:10.5px;letter-spacing:-.02em}
.ps-face{appearance:none;font:inherit;cursor:pointer;flex:1 1 0;min-width:0;padding:14px 6px;border:1px solid #2a2622;background:#141210;border-radius:14px;text-align:center;text-decoration:none;color:#F5F1EA;transition:border-color .3s,transform .35s cubic-bezier(.16,1,.3,1),background .3s}
.ps-face:hover{border-color:rgba(232,87,74,.5);background:rgba(232,87,74,.05);transform:translateY(-3px)}
.ps-face.is-active{border-color:#E8574A;background:rgba(232,87,74,.12);box-shadow:0 0 0 1px #E8574A inset}
.ps-face:focus-visible{outline:2px solid #E8574A;outline-offset:2px}
.ps-face img{width:44px;height:44px;border-radius:50%;object-fit:cover;object-position:center 30%;box-shadow:0 0 0 2px #0E0D0B,0 0 0 3px rgba(232,87,74,.55)}
.ps-face b{display:block;margin-top:10px;font-size:11.5px;font-weight:600;letter-spacing:-.01em;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:clip}
.ps-face small{display:block;margin-top:5px;font:600 9px 'JetBrains Mono',monospace;letter-spacing:.04em;white-space:nowrap;text-transform:uppercase;color:#E8574A}
.ps-cta{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:13px 18px;border-radius:999px;border:1px solid rgba(245,241,234,.18);background:rgba(245,241,234,.05);font-size:13.5px;font-weight:600;color:#F5F1EA;text-decoration:none;transition:border-color .3s,background .3s}
.ps-cta span{color:#E8574A}
.ps-cta:hover{border-color:rgba(232,87,74,.72);background:rgba(232,87,74,.16)}

/* entrance (JS adds .is-armed only when motion is allowed) */
.proof-story.is-armed .ps-line{--ps-off:100}
.proof-story.is-armed .ps-mark,.proof-story.is-armed .ps-end,.proof-story.is-armed .ps-end-ring{opacity:0}
.proof-story.is-armed .ps-face{opacity:0;transform:translateY(10px)}
.proof-story.is-in .ps-line{--ps-off:0}
.proof-story.is-in .ps-mark-flag{opacity:1;transition-delay:.1s}
.proof-story.is-in .ps-mark-sign{opacity:1;transition-delay:.9s}
.proof-story.is-in .ps-end,.proof-story.is-in .ps-end-ring{opacity:1;transition:opacity .4s 1.7s}
.proof-story.is-in .ps-face{opacity:1;transform:none;transition:opacity .5s,transform .5s cubic-bezier(.16,1,.3,1),border-color .3s,background .3s}
.proof-story.is-in .ps-face:hover{transform:translateY(-3px)}

/* artist swap */
.ps-photo img,.ps-data{transition:opacity .2s ease,transform 1.4s cubic-bezier(.16,1,.3,1)}
.ps-card.is-swapping .ps-photo img,.ps-card.is-swapping .ps-data{opacity:0}
.ps-card.is-replay .ps-line{transition:none;--ps-off:100}
.ps-card.is-replay .ps-mark,.ps-card.is-replay .ps-end,.ps-card.is-replay .ps-end-ring{transition:none;opacity:0}

@media (max-width:1100px){
  .ps-card{grid-template-columns:320px 1fr}
  .ps-to{font-size:84px}
  .ps-more-row{flex-wrap:wrap}
  .ps-faces{flex-basis:100%}
}
@media (max-width:760px){
  .proof-story{padding:72px 0 64px}
  .proof-story .wrap{padding:0 20px}
  .ps-top{flex-direction:column;align-items:flex-start;gap:16px}
  .ps-lead{font-size:15.5px}
  .ps-card{grid-template-columns:1fr;margin-top:30px;border-radius:20px}
  .ps-photo{min-height:300px}
  .ps-photo img{object-position:center 28%}
  .ps-name b{font-size:34px}
  .ps-data{padding:24px 20px 22px}
  .ps-from{font-size:28px}.ps-arrow{font-size:20px}.ps-to{font-size:60px}
  .ps-hero-n{flex-wrap:wrap;row-gap:4px}
  .ps-long-num .ps-to{font-size:44px}.ps-long-num .ps-from{font-size:22px}
  .ps-chart{height:130px;margin-top:16px}
  .ps-mark text{font-size:15px}
  .ps-metrics{grid-template-columns:1fr!important}
  .ps-metrics div{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0 0}
  .ps-metrics span{font-size:10px;letter-spacing:.1em}
  .ps-metrics b{margin-top:0;font-size:22px}.ps-metrics i{font-size:14px}
  .ps-more{margin-top:22px;gap:14px}
  .ps-faces{overflow-x:auto;overflow-y:visible;scroll-snap-type:x mandatory;margin:-8px -20px 0;padding:10px 20px 8px;scrollbar-width:none}
  .ps-faces::-webkit-scrollbar{display:none}
  .ps-face{flex:0 0 112px;scroll-snap-align:start}
  .ps-cta{width:100%;justify-content:space-between}
}
@media (prefers-reduced-motion:reduce){
  .ps-end-ring{animation:none}
  .ps-line,.ps-mark,.ps-face,.ps-photo img{transition:none}
}

/* Touch: no hover lift (it stuck on the last-tapped card); only the showing artist is outlined */
@media (hover:none){
  .ps-face:hover,.proof-story.is-in .ps-face:hover{transform:none;border-color:#2a2622;background:#141210}
  .proof-story.is-in .ps-face.is-active,.ps-face.is-active{border-color:rgba(232,87,74,.75);background:rgba(232,87,74,.07)}
}

/* Phones: snap cards to the padded edge, so the first card's outline is never cut off */
@media (max-width:760px){
  .ps-faces{scroll-padding-inline:20px}
}
