/* Homepage portfolio preview. Mirrors the look of /portfolio/. Scoped to .pfh so nothing else on the site changes. */
.pfh{--pfh-paper:#0B0B0A;--pfh-card:#151514;--pfh-ink:#ECECE8;--pfh-soft:#A9A9A4;--pfh-ground:#242423;--pfh-accent:#47060b;--pfh-hair:#ECECE8;--pfh-band:#ECECE8;--pfh-band-ink:#0A0A0A;--pfh-display:"Archivo","Arial Black","Helvetica Neue",Arial,sans-serif;--pfh-mono:"Space Mono","SFMono-Regular",Menlo,Consolas,monospace;background:var(--pfh-paper);color:var(--pfh-ink);font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-size:16px;line-height:1.55;color-scheme:dark;scroll-margin-top:72px;text-transform:none;letter-spacing:normal;font-weight:400;text-align:left}
#work.pfh{padding:0;margin:0;border:0}
.pfh *,.pfh *::before,.pfh *::after{box-sizing:border-box}
.pfh-in{max-width:1360px;margin-inline:auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
@media (min-width:900px){.pfh-in{padding-left:max(40px,env(safe-area-inset-left,0px));padding-right:max(40px,env(safe-area-inset-right,0px))}}
.pfh-label{font-family:var(--pfh-mono);font-size:11px;line-height:1.45;letter-spacing:.2em;text-transform:uppercase;font-weight:400;margin:0}
.pfh-soft{color:var(--pfh-soft)}
.pfh-display{font-family:var(--pfh-display);font-weight:900;font-stretch:118%;text-transform:uppercase;line-height:.9;letter-spacing:-.005em;text-wrap:balance;margin:0}
.pfh-acc{color:var(--pfh-accent)}

.pfh-top{padding-block:clamp(48px,7vw,88px) 40px;display:grid;gap:28px}
.pfh-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 24px}
.pfh-title{font-size:clamp(64px,14vw,176px)}
.pfh-foot{display:grid;gap:24px;align-items:end}
@media (min-width:860px){.pfh-foot{grid-template-columns:minmax(0,1fr) auto}}
.pfh-copy{display:grid;gap:16px;min-width:0}
.pfh-lede{font-size:20px;line-height:1.45;max-width:36ch;margin:0}
.pfh-status{display:flex;align-items:center;gap:12px}
.pfh-status::before{content:"";width:24px;height:2px;background:var(--pfh-accent);flex:none}

.pfh-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--pfh-mono);font-weight:700;font-size:11px;line-height:1;letter-spacing:.2em;text-transform:uppercase;padding:15px 18px;border:1px solid var(--pfh-ink);background:var(--pfh-ink);color:var(--pfh-paper);text-decoration:none;white-space:nowrap;justify-self:start}
.pfh-btn.pfh-line{background:transparent;color:var(--pfh-ink)}
.pfh-btn:hover{background:var(--pfh-accent);border-color:var(--pfh-accent);color:var(--pfh-ink)}

.pfh-ticker{background:var(--pfh-band);color:var(--pfh-band-ink);overflow:hidden;white-space:nowrap;padding-block:14px}
.pfh-ticker-track{display:inline-flex;animation:pfh-tick 42s linear infinite}
.pfh-ticker-track span{font-family:var(--pfh-display);font-weight:900;font-stretch:118%;text-transform:uppercase;font-size:22px;line-height:1;padding-right:28px}
.pfh-ticker-track span.pfh-x{font-family:var(--pfh-mono);font-weight:400;font-size:18px}
@keyframes pfh-tick{to{transform:translateX(-50%)}}

.pfh-work{padding-block:40px 80px}
.pfh-work-head{display:grid;gap:16px;border-top:1px solid var(--pfh-hair);padding-top:16px;margin-bottom:28px}
.pfh-filters{display:flex;flex-wrap:wrap;gap:8px}
.pfh-filters:empty{display:none}
.pfh-chip{font-family:var(--pfh-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;padding:9px 12px;border:1px solid var(--pfh-ink);background:transparent;color:var(--pfh-ink);border-radius:0;cursor:pointer;margin:0}
.pfh-chip[aria-pressed="true"]{background:var(--pfh-ink);color:var(--pfh-paper)}
.pfh-chip:not([aria-pressed="true"]):hover{background:var(--pfh-accent);border-color:var(--pfh-accent)}

.pfh-grid{display:grid;gap:24px;grid-template-columns:minmax(0,1fr)}
@media (min-width:640px){.pfh-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.pfh-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:639px){.pfh-grid>.pfh-card:nth-child(n+4){display:none}}
.pfh-card{background:var(--pfh-card);border:1px solid var(--pfh-hair);display:flex;flex-direction:column;min-width:0;color:inherit;text-decoration:none}
.pfh-strip{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--pfh-ground);padding:9px 12px;border-bottom:1px solid var(--pfh-hair)}
.pfh-marks{display:inline-flex;gap:5px;flex:none}
.pfh-marks i{width:8px;height:8px;border:1px solid var(--pfh-ink);display:block}
.pfh-media{display:block;aspect-ratio:4/5;background:var(--pfh-ground);position:relative;overflow:hidden;border-bottom:1px solid var(--pfh-hair)}
.pfh-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s ease}
.pfh-card:hover .pfh-media img{transform:scale(1.03)}
.pfh-body{display:grid;gap:10px;align-content:start;padding:18px 18px 24px;flex:1}
.pfh-h3{display:block;font-size:30px}
.pfh-sum{display:block;font-size:15px;line-height:1.5;color:var(--pfh-soft);max-width:46ch}
.pfh-more{display:inline-block;margin-top:4px}
.pfh-card:hover .pfh-more{text-decoration:underline;text-decoration-color:var(--pfh-accent);text-decoration-thickness:2px;text-underline-offset:4px}
@media (min-width:640px){
  .pfh-card.pfh-feature{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);grid-template-rows:auto 1fr}
  .pfh-feature .pfh-strip{grid-column:1/-1}
  .pfh-feature .pfh-media{aspect-ratio:5/4;border-bottom:0;border-right:1px solid var(--pfh-hair)}
  .pfh-feature .pfh-body{padding:clamp(20px,3vw,36px);align-content:end;gap:14px}
  .pfh-feature .pfh-h3{font-size:clamp(36px,4.6vw,72px)}
  .pfh-feature .pfh-sum{font-size:18px}
}
.pfh-all{margin-top:28px;display:flex}
.pfh-card:focus-visible,.pfh-chip:focus-visible,.pfh-btn:focus-visible{outline:2px solid var(--pfh-ink);outline-offset:3px}
.pfh[data-state="fallback"] .pfh-work-head,.pfh[data-state="fallback"] .pfh-grid{display:none}
@media (prefers-reduced-motion:reduce){.pfh-ticker-track{animation:none}.pfh-media img{transition:none}}
