/* Puzzle-led homepage study. Mobile first; shared chrome and type come from site.css. */
.puzzle-hero,.pz-evidence{--pz-orange:#F26327;--pz-blue:#1A5FD7;--pz-navy:#2D3142;--pz-grey:#BFC0C0;--pz-gold:#F7C948}
.puzzle-hero{padding-top:18px}
.puzzle-hero [hidden],.pz-evidence [hidden]{display:none!important}
.ph-prelude{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 16px;margin-bottom:14px}
.puzzle-hero .ph-name{margin:0;font-size:22px;font-weight:500;letter-spacing:-.6px;line-height:1.2;color:var(--ink)}
.ph-name span{font-size:13px;letter-spacing:0;margin-left:6px;color:var(--ink-2)}
.ph-where{margin:0;font:500 10px/1.6 var(--kicker);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}

/* Story: Dr. Deb stays put while the visitor scrolls; the ground behind her changes with each chapter. */
.ph-story{--ph-h:clamp(330px,56svh,520px);position:relative}
.ph-panel{position:sticky;top:70px;z-index:2;height:var(--ph-h);margin:0 -30px;overflow:clip;isolation:isolate;background:var(--pz-orange);container-type:size}
.ph-field,.ph-overlay,.ph-grain,.ph-letters{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.ph-field{z-index:0}
.ph-grain{z-index:1;opacity:.5;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1.4 -.25'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E")}
.ph-letters{z-index:2;color:#fff}
.ph-overlay{z-index:3}
.ph-letter{position:absolute;left:0;top:0;display:block;overflow:visible;fill:currentColor;transform-origin:50% 50%;will-change:transform}
.ph-figure{--fw:calc(118cqh);position:absolute;z-index:4;left:calc(50cqw - var(--fw)*.53);bottom:calc(var(--fw)*-.192);width:var(--fw);height:calc(var(--fw)*.75);pointer-events:none}
.ph-figure picture{display:block}
.ph-figure .deb-photograph{display:block;width:100%;height:auto;max-width:none;clip-path:url(#deb-cut-paper)}
.portrait-definitions{position:absolute;pointer-events:none}
.ph-motion{position:absolute;z-index:6;top:8px;right:14px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:#fff;font:400 14px var(--body);cursor:pointer}
.ph-motion span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);backdrop-filter:blur(6px)}

.ph-steps{position:relative;z-index:1}
.ph-step{min-height:max(270px,calc(100svh - 70px - var(--ph-h)));padding:26px 0 30px;box-sizing:border-box}
.ph-eyebrow{font:500 10px/1.5 var(--kicker);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);margin:0 0 10px}
.ph-stars{color:var(--pz-orange);letter-spacing:.12em;margin-right:4px}
.ph-step h2{font:500 26px/1.12 var(--display);letter-spacing:-.9px;margin:0 0 12px;max-width:19ch}
.ph-step>p:not(.ph-eyebrow),.ph-step blockquote p{font-size:14px;line-height:1.6;color:var(--ink-2);margin:0;max-width:40ch}
.ph-step blockquote{margin:0;padding:0;border:0;background:none}
.ph-step blockquote p{font-size:16px;line-height:1.5;color:var(--ink)}
.ph-step blockquote .ph-cite{font-size:12px;color:var(--ink-soft);margin:8px 0 0}
.ph-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:4px;font-size:13px;color:var(--ink);text-underline-offset:4px}
.ph-next{display:grid;gap:15px;padding:30px 30px 5px}
.ph-next>p{font-size:18px;line-height:1.5;letter-spacing:-.4px;margin:0}
.ph-next>p span{color:var(--ink-soft)}
.ph-next .cta-row{margin:0;gap:8px}
.ph-next .btn{min-height:48px;font-size:14px;padding:14px 18px}
.ph-next .btn-primary{display:inline-flex;gap:20px;align-items:center}
.puzzle-hero :is(button,a):focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.ph-motion:focus-visible{outline-color:#fff;outline-offset:-3px}

@media(min-width:700px){
  .ph-story{--ph-h:clamp(420px,60svh,620px)}
  .ph-step{padding-top:34px}
  .ph-step h2{font-size:32px}
  .ph-next{grid-template-columns:1fr auto;align-items:center}
}
@media(min-width:960px){
  .puzzle-hero{padding-top:26px}
  .ph-story{--ph-h:clamp(540px,calc(100vh - 168px),820px);display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,1fr);gap:0 64px;align-items:start}
  .ph-panel{top:90px;margin:0;border-radius:22px}
  .ph-steps{padding-bottom:calc(var(--ph-h)*.18)}
  .ph-step{display:flex;flex-direction:column;justify-content:center;min-height:calc(var(--ph-h)*.82);padding:0;opacity:.24;transition:opacity .5s var(--ease-out)}
  .ph-step:first-child{min-height:var(--ph-h)}
  .ph-step.is-active{opacity:1}
  .ph-step h2{font-size:36px;letter-spacing:-1.2px}
  .ph-step>p:not(.ph-eyebrow){font-size:15px}
  .ph-step blockquote p{font-size:19px}
  .puzzle-hero .ph-name{font-size:25px}
  .ph-motion{top:14px;right:16px}
  .ph-next{padding-left:30px;padding-right:30px}
}
@media(prefers-reduced-motion:reduce){.puzzle-hero *,.pz-evidence *{transition:none!important;animation:none!important}.ph-letter{will-change:auto}}

/* Clinic records. */
.pz-evidence{padding:72px 0 60px}
.pz-evidence-head{max-width:740px;margin-bottom:26px}
.pz-evidence-head h2{margin:0}
.pz-card{background:var(--white);border-radius:var(--radius-card);padding:24px 18px;margin:0 0 18px;min-width:0}
.pz-card h3{font-size:24px;letter-spacing:-.6px;margin:0 0 8px}
.pz-card figcaption>p{font-size:14px;color:var(--ink-soft);line-height:1.6;margin:0}
.pz-bars{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:13px}
.pz-bars li{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'label value' 'track track';gap:6px 12px;align-items:baseline}
.pz-bars .label{grid-area:label}.pz-bars .value{grid-area:value}.pz-bars .track{grid-area:track}
.pz-bars .label{font-size:14px;color:var(--ink);line-height:1.3}
.pz-bars .value{font-size:14px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.pz-bars .track{position:relative;height:8px;border-radius:0 4px 4px 0;background:#f1efec}
.pz-bars .fill{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:0 4px 4px 0;background:var(--pz-orange);transition:width .9s var(--ease-out)}
.pz-card.pz-complex{background:var(--pz-navy);color:#fff;position:relative;overflow:hidden;isolation:isolate}
.pz-complex h3{color:#fff}
.pz-complex figcaption>p{color:rgba(255,255,255,.72)}
.pz-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:20px 0 4px}
.pz-stats p{margin:0;font-size:13px;line-height:1.4;color:rgba(255,255,255,.78)}
.pz-stats strong{display:block;font-size:40px;font-weight:500;letter-spacing:-1.6px;color:#fff;line-height:1.05;margin-bottom:6px;font-variant-numeric:tabular-nums}
.pz-view-note{font-size:12px;line-height:1.55;color:rgba(255,255,255,.62);margin:14px 0 0}
.pz-canvas{position:relative;height:440px;margin-top:6px;touch-action:pan-y}
.pz-canvas svg{display:block;width:100%;height:100%;overflow:visible}
.pz-canvas text{font-family:var(--body)}
.pz-tip{position:absolute;z-index:3;pointer-events:none;background:#fff;color:var(--pz-navy);font-size:12px;font-weight:500;line-height:1.4;padding:7px 10px;border-radius:4px;white-space:nowrap;transform:translate(-50%,calc(-100% - 10px));opacity:0;transition:opacity .15s}
.pz-tip[data-on]{opacity:1}
.pz-legend{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px;font-size:12px;color:rgba(255,255,255,.82)}
.pz-legend span{display:inline-flex;align-items:center;gap:7px}
.pz-legend i{width:10px;height:10px;border-radius:50%}
.pz-source{font-size:11px;line-height:1.7;color:var(--ink-soft);margin:6px 0 0;max-width:80ch}
.pz-float{animation:pz-float var(--d,9s) ease-in-out var(--delay,0s) infinite alternate}
@keyframes pz-float{from{transform:translate(0,0)}to{transform:translate(var(--dx,2px),var(--dy,-3px))}}
.pz-canvas[data-paused] *{animation-play-state:paused!important}
@media(min-width:700px){
  .pz-card{padding:30px}
  .pz-bars li{grid-template-columns:200px minmax(0,1fr) 44px;grid-template-areas:'label track value';align-items:center;gap:16px}
  .pz-bars .track{height:10px}
  .pz-bars .value{text-align:right}
  .pz-stats strong{font-size:48px}
  .pz-canvas{height:500px}
}
@media(min-width:1050px){
  .pz-evidence{padding-top:96px}
  .pz-evidence>.wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:20px;align-items:start}
  .pz-evidence-head,.pz-source,.pz-evidence .portrait-specialties{grid-column:1/-1}
  .pz-card{margin:0;padding:34px}
  .pz-bars li{grid-template-columns:180px minmax(0,1fr) 44px}
}

/* Carried over from the portrait study. */
.portrait-specialties{display:flex;flex-wrap:wrap;gap:0 25px;margin-top:20px}
.portrait-specialties a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;color:var(--ink);text-underline-offset:5px}
.portrait-clinic{padding:65px 0 35px}
.portrait-clinic-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:20px;margin-bottom:25px}
.portrait-clinic h2{margin:0;font-size:36px;letter-spacing:-1.2px}
.portrait-clinic-head p{font-size:14px;line-height:1.65}
.portrait-clinic-head a{color:var(--ink);display:inline-flex;min-height:44px;align-items:center;text-underline-offset:4px}
.portrait-clinic-photos{display:grid;grid-template-columns:1.4fr 1fr;gap:12px}
.portrait-clinic-photos img{width:100%;height:210px;object-fit:cover;border-radius:var(--radius-card)}
.portrait-draft{padding:25px 0 32px;font-size:12px;line-height:1.6;color:var(--ink-soft)}
@media(min-width:700px){.portrait-clinic-photos img{height:330px}}
@media(min-width:1050px){.portrait-clinic-photos img{height:390px}}