/* Portfolio primitives v1. Opt-in via .pf-root; derived from the existing case studies. */
.pf-root {
  --pf-paper:#fff; --pf-ink:#171717; --pf-muted:#656565; --pf-line:#ccc; --pf-surface:#f1f2ef; --pf-accent:#171717;
  --pf-font:'Helvetica Neue',Helvetica,Arial,sans-serif;
  --pf-text-small:.875rem; --pf-text-body:clamp(1.0625rem,1.3vw,1.1875rem); --pf-text-lead:clamp(1.1875rem,2vw,1.625rem);
  --pf-text-heading:clamp(2rem,4vw,3.375rem); --pf-text-display:clamp(3.5rem,8vw,7.25rem);
  --pf-space-1:8px; --pf-space-2:12px; --pf-space-3:18px; --pf-space-4:24px; --pf-space-5:40px; --pf-space-6:70px; --pf-space-7:110px;
  --pf-gutter:clamp(20px,4vw,48px); --pf-gap:clamp(12px,2vw,30px); --pf-section-space:clamp(50px,7vw,90px);
  --pf-width:1200px; --pf-wide:1400px; --pf-measure:680px;
  color:var(--pf-ink); background:var(--pf-paper); font:var(--pf-text-body)/1.55 var(--pf-font);
}
.pf-root *, .pf-root *::before, .pf-root *::after {box-sizing:border-box}
.pf-root :where(h1,h2,h3,p,figure,dl,dd){margin:0}
.pf-root :where(img,video){display:block;max-width:100%;height:auto}
.pf-root :where(a){color:inherit;text-underline-offset:.25em}
.pf-root :where(button,input,select){font:inherit}
.pf-root :where(button,a,summary,input,select):focus-visible{outline:3px solid var(--pf-accent);outline-offset:5px}
.pf-root[data-pf-theme="shipshape"],.pf-root [data-pf-theme="shipshape"]{--pf-paper:#f7f7f2;--pf-accent:#254c9f;--pf-surface:#eeeee6}
.pf-root[data-pf-theme="skin"],.pf-root [data-pf-theme="skin"]{--pf-paper:#13392e;--pf-ink:#fff4d8;--pf-muted:#d1d7c5;--pf-line:#81978b;--pf-surface:#20483b;--pf-accent:#fff4d8}
.pf-root[data-pf-theme="rosie"],.pf-root [data-pf-theme="rosie"]{--pf-paper:#f5f2e8;--pf-ink:#302e26;--pf-muted:#615c50;--pf-line:#b7b19f;--pf-surface:#e8e1ce;--pf-accent:#302e26}
.pf-container{width:min(100%,var(--pf-width));margin-inline:auto;padding-inline:var(--pf-gutter)}
.pf-container[data-width="wide"]{--pf-width:var(--pf-wide)}
.pf-stack{display:flex;flex-direction:column;gap:var(--pf-stack-gap,var(--pf-space-4))}
.pf-measure{max-width:var(--pf-measure)}
.pf-section{margin-block:var(--pf-section-space)}
.pf-display{font-size:var(--pf-text-display);line-height:.96;letter-spacing:-.065em;font-weight:500;color:var(--pf-accent);max-width:1000px}
.pf-heading{font-size:var(--pf-text-heading);line-height:1.08;letter-spacing:-.045em;font-weight:500;color:var(--pf-accent)}
.pf-lead{font-size:var(--pf-text-lead);line-height:1.4;max-width:850px}
.pf-caption{font-size:var(--pf-text-small);line-height:1.45;color:var(--pf-muted);margin-top:var(--pf-space-2);max-width:var(--pf-measure)}
.pf-split{display:grid;grid-template-columns:1fr 1.35fr;gap:clamp(24px,6vw,80px);align-items:start}
.pf-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--pf-space-5);font-size:var(--pf-text-small);padding-top:var(--pf-space-4);border-top:1px solid var(--pf-line)}
.pf-meta dt{color:var(--pf-muted);margin-bottom:var(--pf-space-1)}
.pf-set{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--pf-gap);align-items:start}
.pf-set>*{min-width:0}
.pf-set :where(img,video){width:100%;height:auto;object-fit:contain}
.pf-set[data-layout="trio"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.pf-set[data-layout="single"]{grid-template-columns:1fr;max-width:800px;margin-inline:auto}
.pf-set[data-layout="masonry"]{display:block;columns:3;column-gap:var(--pf-gap)}
.pf-set[data-layout="masonry"]>*{display:inline-block;width:100%;break-inside:avoid;margin-bottom:var(--pf-gap)}
.pf-paper{background:var(--pf-surface);padding:clamp(18px,3vw,40px)}
.pf-paper img{max-height:730px;width:100%;object-fit:contain}
.pf-film{width:100%;background:var(--pf-ink)}
.pf-film video{width:100%;max-height:85svh;object-fit:contain}
.pf-disclosure{border-top:1px solid var(--pf-line);border-bottom:1px solid var(--pf-line);padding-block:var(--pf-space-4)}
.pf-disclosure summary{cursor:pointer;font-size:var(--pf-text-lead);color:var(--pf-accent)}
.pf-disclosure[open]>:not(summary){margin-top:var(--pf-space-4)}
.pf-quote{font-size:var(--pf-text-heading);line-height:1.2;letter-spacing:-.035em;margin:0;max-width:1000px}
.pf-link{display:inline-block;color:var(--pf-accent)}
.pf-next{display:block;text-decoration:none;border-top:1px solid var(--pf-line);padding-block:var(--pf-space-5)}
.pf-next span{display:block;font-size:var(--pf-text-small);color:var(--pf-muted);margin-bottom:var(--pf-space-2)}
.pf-next strong{display:block;font-size:var(--pf-text-heading);font-weight:500;letter-spacing:-.045em;color:var(--pf-accent)}
.pf-next:hover strong{text-decoration:underline;text-underline-offset:.15em}
@media(max-width:700px){.pf-split,.pf-meta{grid-template-columns:1fr;gap:var(--pf-space-4)}.pf-set,.pf-set[data-layout="trio"]{grid-template-columns:1fr}.pf-set[data-layout="masonry"]{columns:2}}
@media(prefers-reduced-motion:reduce){.pf-root{scroll-behavior:auto}}
/* Added during the ShipShape migration: grouped chapters and related concepts. */
.pf-chapter{display:flex;flex-direction:column;gap:var(--pf-space-5);margin-block:var(--pf-section-space)}
.pf-collection{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--pf-space-6) var(--pf-space-5);align-items:start}
.pf-collection>*{min-width:0}
.pf-subheading{font-size:clamp(1.625rem,2.5vw,2rem);line-height:1.15;letter-spacing:-.04em;font-weight:500;color:var(--pf-accent)}
.pf-tags{display:flex;flex-wrap:wrap;gap:var(--pf-space-2) var(--pf-space-4);border-top:1px solid var(--pf-line);padding-top:var(--pf-space-4);font-size:var(--pf-text-small)}
@media(max-width:700px){.pf-collection{grid-template-columns:1fr;gap:var(--pf-space-5)}.pf-chapter{gap:var(--pf-space-4)}}
/* Film-led opening and event detail patterns, first used by The Food Talk. */
.pf-hero{position:relative;isolation:isolate;min-height:650px;height:90svh;width:100vw;margin-left:calc(50% - 50vw);overflow:hidden;background:var(--pf-ink);color:#fff}
.pf-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#000b,transparent 85%),linear-gradient(90deg,#0008,transparent)}
.pf-hero-media{position:absolute;inset:0;z-index:-2}
.pf-hero-media video{height:100%;width:100%;object-fit:cover}
.pf-hero-copy{position:absolute;left:var(--pf-gutter);right:var(--pf-gutter);bottom:16%;max-width:1150px}
.pf-hero-copy .pf-display{color:inherit}
.pf-hero-copy>p{font-size:var(--pf-text-small);max-width:600px}
.pf-hero-credit{position:absolute;left:var(--pf-gutter);right:var(--pf-gutter);bottom:24px;font-size:12px;max-width:700px}
.pf-hero-cue{position:absolute;right:var(--pf-gutter);bottom:24px;font-size:12px}
.pf-agenda{list-style:none;margin:0;padding:0}
.pf-agenda li{display:grid;grid-template-columns:100px 1fr;gap:var(--pf-space-4);padding-block:var(--pf-space-4);border-top:1px solid var(--pf-line)}
.pf-agenda time{font-size:var(--pf-text-small);color:var(--pf-muted)}
.pf-agenda strong{font-weight:500;font-size:var(--pf-text-lead)}
.pf-agenda p{max-width:var(--pf-measure);margin-top:var(--pf-space-1)}
.pf-reference{border-top:1px solid var(--pf-line);padding-top:var(--pf-space-4);margin-block:var(--pf-space-5);max-width:var(--pf-measure)}
.pf-reference blockquote{margin:0}
@media(max-width:700px){.pf-hero{min-height:580px;height:90svh}.pf-hero-copy .pf-display{font-size:clamp(44px,11vw,70px)}.pf-hero-credit{bottom:20px;max-width:260px}.pf-hero-cue{display:none}.pf-agenda li{grid-template-columns:1fr;gap:var(--pf-space-2)}}
/* Click-through slide decks and full-length films. */
.pf-deck{padding:clamp(12px,3vw,40px);background:var(--pf-surface)}
.pf-deck [data-slide] img{width:100%;height:auto}
.pf-deck-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:var(--pf-space-4)}
.pf-deck-controls button{border:1px solid var(--pf-line);background:var(--pf-paper);color:var(--pf-ink);padding:10px 16px;cursor:pointer}
.pf-deck-controls button:disabled{opacity:.4;cursor:default}
.pf-film-launch{display:block;width:100%;border:0;padding:0;background:transparent;cursor:pointer;text-align:left;color:inherit}
.pf-film-launch video{pointer-events:none}
.pf-film-launch>span{display:block;margin-top:12px;text-decoration:underline;font-size:var(--pf-text-small)}
.pf-film-dialog{width:min(1100px,95vw);background:#111;color:white;padding:52px 16px 16px}
.pf-film-dialog video{width:100%;max-height:78svh;display:block;background:#000}
.pf-film-dialog .close{background:#111;color:white}
/* Survey distributions: visible labels and counts remain readable without color. */
.pf-chart{padding:var(--pf-space-4);background:var(--pf-surface)}
.pf-chart ul{list-style:none;padding:0;margin:0;display:grid;gap:24px}
.pf-chart-label{display:flex;justify-content:space-between;gap:12px;font-size:var(--pf-text-small);margin-bottom:8px}
.pf-chart-track{height:14px;background:#00000012}
.pf-chart-bar{display:block;height:100%;background:var(--pf-accent)}
/* The same full-bleed opening can hold a still photograph. */
.pf-hero-media>img{width:100%;height:100%;object-fit:cover}

/* Editorial photography sequence: wide frames with offset pairs. */
.pf-editorial{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(20px,4vw,60px);row-gap:clamp(40px,7vw,100px)}
.pf-editorial figure{min-width:0}.pf-editorial img{width:100%;height:auto}
.pf-editorial [data-placement="wide"]{grid-column:1/-1}
.pf-editorial [data-placement="left"]{grid-column:2/7}
.pf-editorial [data-placement="right"]{grid-column:8/13;padding-top:clamp(60px,12vw,180px)}
.pf-editorial [data-placement="half-left"]{grid-column:1/7}
.pf-editorial [data-placement="half-right"]{grid-column:7/13;align-self:end}
@media(max-width:700px){.pf-editorial [data-placement="left"]{grid-column:1/11}.pf-editorial [data-placement="right"]{grid-column:3/-1;padding-top:0}.pf-editorial [data-placement="half-left"]{grid-column:1/12}.pf-editorial [data-placement="half-right"]{grid-column:2/13}}

/* Searchable project collection; card artwork can keep its own treatment. */
.pf-project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--pf-gap)}
.pf-project-grid>*{min-width:0}.pf-project-grid>[hidden]{display:none!important}
@media(max-width:800px){.pf-project-grid{grid-template-columns:1fr}}