/* PORTFOLIO family — batch 2 variants. Tokens only; reduced-motion fallbacks required. */

/* 1. Polaroid pile */
.apb-rx-pfpol{padding:clamp(56px,10vh,110px) 24px;overflow:hidden;
  background:radial-gradient(70vmax 50vmax at 85% -10%,var(--apb-rx-soft,#f4f5f7),transparent 60%),var(--apb-rx-surface,#fff)}
.apb-rx-pfpol-wrap{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,64px);align-items:center}
.apb-rx-pfpol-pile{position:relative;height:clamp(380px,52vh,520px)}
.apb-rx-pfpol-card{position:absolute;width:clamp(150px,17vw,230px);background:var(--apb-rx-surface,#fff);padding:10px 10px 14px;
  border-radius:calc(var(--apb-rx-radius) * .4);box-shadow:0 14px 34px -12px rgba(11,13,18,.35);text-decoration:none;
  transform:rotate(var(--rot,0deg));transition:transform var(--apb-rx-t,.28s),box-shadow var(--apb-rx-t,.28s);z-index:var(--z,1)}
.apb-rx-pfpol-card:hover{transform:rotate(0deg) translateY(-10px) scale(1.04);box-shadow:0 26px 54px -18px rgba(11,13,18,.45);z-index:9}
.apb-rx-pfpol-card img{width:100%;aspect-ratio:1;object-fit:cover;display:block;background:var(--apb-rx-soft,#f4f5f7)}
.apb-rx-pfpol-card figcaption{padding-top:10px;text-align:center;font-size:13px;font-weight:600;color:var(--apb-rx-ink,#0b0d12);letter-spacing:.01em}
.apb-rx-pfpol-card::before{content:"";position:absolute;top:-10px;left:50%;width:64px;height:22px;transform:translateX(-50%) rotate(calc(var(--rot,0deg) * -.5));
  background:color-mix(in srgb,var(--apb-rx-brand) 24%,rgba(255,255,255,.6));opacity:.9;clip-path:polygon(3% 15%,97% 0%,100% 85%,0% 100%)}
@media(max-width:860px){
  .apb-rx-pfpol-wrap{grid-template-columns:1fr}
  .apb-rx-pfpol-pile{height:auto;display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
  .apb-rx-pfpol-card{position:static;width:auto;--rot:0deg}
}
@media (prefers-reduced-motion:reduce){.apb-rx-pfpol-card{transition:none}}

/* 2. Minimal grid */
.apb-rx-pfmin{padding:clamp(64px,11vh,120px) 24px;background:var(--apb-rx-surface,#fff)}
.apb-rx-pfmin-wrap{max-width:1040px;margin:0 auto}
.apb-rx-pfmin-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;
  border-bottom:var(--apb-rx-border,1px) solid var(--apb-rx-ink,#0b0d12);padding-bottom:18px;margin-bottom:clamp(32px,6vh,56px)}
.apb-rx-pfmin-head h2{margin:0;font-family:var(--apb-rx-font-display,inherit);font-weight:var(--apb-rx-display-weight,800);
  font-size:clamp(28px,4vw,44px);letter-spacing:-.02em;color:var(--apb-rx-ink,#0b0d12)}
.apb-rx-pfmin-count{font-size:13px;color:var(--apb-rx-muted,#6b7280);font-variant-numeric:tabular-nums}
.apb-rx-pfmin-grid{display:grid;grid-template-columns:repeat(var(--apb-rx-cols,3),1fr);gap:clamp(24px,4vw,48px) clamp(18px,3vw,32px)}
.apb-rx-pfmin-item{text-decoration:none;display:block}
.apb-rx-pfmin-media{overflow:hidden;aspect-ratio:4/5;background:var(--apb-rx-soft,#f4f5f7);display:block}
.apb-rx-pfmin-media img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform var(--apb-rx-t-slow,.55s) cubic-bezier(.4,0,.2,1),opacity var(--apb-rx-t,.28s)}
.apb-rx-pfmin-item:hover img{transform:scale(1.04)}
.apb-rx-pfmin-cap{display:flex;align-items:baseline;gap:10px;padding-top:12px;border-top:var(--apb-rx-border,1px) solid var(--apb-rx-line,#e7e8ec);margin-top:12px}
.apb-rx-pfmin-cap i{font-style:normal;font-size:11px;font-weight:700;color:var(--apb-rx-fg-subtle,#a1a1aa);font-variant-numeric:tabular-nums}
.apb-rx-pfmin-cap b{font-size:14.5px;font-weight:650;letter-spacing:-.005em;color:var(--apb-rx-ink,#0b0d12);transition:color var(--apb-rx-t-fast,.16s)}
.apb-rx-pfmin-item:hover .apb-rx-pfmin-cap b{color:var(--apb-rx-accent-text,var(--apb-rx-brand))}
.apb-rx-pfmin-cap span{margin-left:auto;font-size:11.5px;color:var(--apb-rx-muted,#6b7280)}
@media(max-width:760px){.apb-rx-pfmin-grid{grid-template-columns:repeat(2,1fr)}}
@media (prefers-reduced-motion:reduce){.apb-rx-pfmin-media img{transition:none}}

/* 3. Film strip */
.apb-rx-pffilm{padding:clamp(56px,10vh,110px) 0;background:var(--apb-rx-ink,#0b0d12);overflow:hidden}
.apb-rx-pffilm .apb-rx-pf-head{max-width:1120px;margin:0 auto clamp(26px,4vh,42px);padding:0 24px}
.apb-rx-pffilm .apb-rx-pf-head h2{color:#fff}
.apb-rx-pffilm .apb-rx-pf-head .apb-rx-eyebrow{color:color-mix(in srgb,var(--apb-rx-brand) 55%,#fff)}
.apb-rx-pffilm-strip{position:relative;padding:26px 0;transform:rotate(-1.6deg) scale(1.02);
  background:color-mix(in srgb,var(--apb-rx-ink,#0b0d12) 92%,#000);border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.apb-rx-pffilm-strip::before,.apb-rx-pffilm-strip::after{content:"";position:absolute;left:0;right:0;height:12px;
  -webkit-mask:repeating-linear-gradient(90deg,transparent 0 14px,#000 14px 26px,transparent 26px 40px);
  mask:repeating-linear-gradient(90deg,transparent 0 14px,#000 14px 26px,transparent 26px 40px);
  background:rgba(255,255,255,.14);border-radius:2px}
.apb-rx-pffilm-strip::before{top:7px}
.apb-rx-pffilm-strip::after{bottom:7px}
.apb-rx-pffilm-track{display:flex;gap:10px;width:max-content;padding-right:10px;
  animation:apbrxPffilmRoll calc(42s / var(--apb-rx-dur,1)) linear infinite}
.apb-rx-pffilm-strip:hover .apb-rx-pffilm-track{animation-play-state:paused}
@keyframes apbrxPffilmRoll{to{transform:translateX(-50%)}}
.apb-rx-pffilm-frame{position:relative;flex:none;width:clamp(200px,24vw,320px);aspect-ratio:3/2;overflow:hidden;text-decoration:none;
  border:2px solid rgba(255,255,255,.1)}
.apb-rx-pffilm-frame img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.92);transition:filter var(--apb-rx-t,.28s),transform var(--apb-rx-t-slow,.55s)}
.apb-rx-pffilm-frame:hover img{filter:saturate(1.1);transform:scale(1.04)}
.apb-rx-pffilm-frame span{position:absolute;left:10px;bottom:8px;font-size:11px;font-weight:700;letter-spacing:.06em;color:#fff;
  background:rgba(11,13,18,.6);padding:4px 10px;border-radius:var(--apb-rx-radius-pill,999px);opacity:0;transition:opacity var(--apb-rx-t-fast,.16s)}
.apb-rx-pffilm-frame:hover span,.apb-rx-pffilm-frame:focus-visible span{opacity:1}
@media (hover:none){.apb-rx-pffilm-frame span{opacity:1}}
.apb-rx-pffilm .apb-rx-pf-ctarow{max-width:1120px;margin:clamp(26px,4vh,40px) auto 0;padding:0 24px}
@media (prefers-reduced-motion:reduce){
  .apb-rx-pffilm-track{animation:none}
  .apb-rx-pffilm-strip{overflow-x:auto}
  .apb-rx-pffilm-frame span{opacity:1}
}

/* 4. Diptych */
.apb-rx-pfdip{padding:clamp(64px,11vh,120px) 24px;background:var(--apb-rx-surface,#fff)}
.apb-rx-pfdip-wrap{max-width:1080px;margin:0 auto}
.apb-rx-pfdip .apb-rx-pf-head{text-align:center;margin-bottom:clamp(40px,7vh,64px)}
.apb-rx-pfdip .apb-rx-pf-head h2{max-width:18ch;margin-inline:auto}
.apb-rx-pfdip-spread{display:grid;grid-template-columns:1.25fr .75fr;gap:14px;margin-bottom:18px}
.apb-rx-pfdip-spread--flip{grid-template-columns:.75fr 1.25fr}
.apb-rx-pfdip-img{display:block;overflow:hidden;border-radius:calc(var(--apb-rx-radius) * .6)}
.apb-rx-pfdip-img img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:3/2;transition:transform var(--apb-rx-t-slow,.55s)}
.apb-rx-pfdip-img--tall img{aspect-ratio:3/3.05}
.apb-rx-pfdip-img--solo img{aspect-ratio:16/9}
.apb-rx-pfdip-img:hover img{transform:scale(1.03)}
.apb-rx-pfdip-cap{display:flex;align-items:baseline;gap:14px;padding:6px 4px clamp(36px,6vh,60px);flex-wrap:wrap}
.apb-rx-pfdip-cap i{font-style:normal;font-size:12px;font-weight:700;color:var(--apb-rx-fg-subtle,#a1a1aa);font-variant-numeric:tabular-nums}
.apb-rx-pfdip-cap b{font-family:var(--apb-rx-font-display,inherit);font-weight:750;font-size:clamp(18px,2.2vw,26px);
  letter-spacing:-.015em;color:var(--apb-rx-ink,#0b0d12)}
.apb-rx-pfdip-cap a{margin-left:auto;font-size:12.5px;font-weight:700;color:var(--apb-rx-accent-text,var(--apb-rx-brand));
  text-decoration:none;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.apb-rx-pfdip-cap a:hover{text-decoration:underline;text-underline-offset:3px}
@media(max-width:720px){.apb-rx-pfdip-spread,.apb-rx-pfdip-spread--flip{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.apb-rx-pfdip-img img{transition:none}}

/* 5. Case cards */
.apb-rx-pfcards{padding:clamp(56px,10vh,110px) 24px;background:var(--apb-rx-soft,#f4f5f7)}
.apb-rx-pfcards-wrap{max-width:1160px;margin:0 auto}
.apb-rx-pfcards-grid{display:grid;grid-template-columns:repeat(var(--apb-rx-cols,3),1fr);gap:18px}
.apb-rx-pfcards-card{display:flex;flex-direction:column;background:var(--apb-rx-surface,#fff);border:var(--apb-rx-border,1px) solid var(--apb-rx-line,#e7e8ec);
  border-radius:var(--apb-rx-radius);overflow:hidden;text-decoration:none;transition:transform var(--apb-rx-t-fast,.16s),box-shadow var(--apb-rx-t,.28s)}
.apb-rx-pfcards-card:hover{transform:translateY(-5px);box-shadow:var(--apb-rx-shadow-3)}
.apb-rx-pfcards-metric{padding:22px 20px 16px;display:block}
.apb-rx-pfcards-metric b{display:block;font-family:var(--apb-rx-font-display,inherit);font-weight:800;
  font-size:clamp(34px,3.6vw,44px);letter-spacing:-.03em;color:var(--apb-rx-accent-text,var(--apb-rx-brand));line-height:1}
.apb-rx-pfcards-metric span{display:block;margin-top:6px;font-size:13px;color:var(--apb-rx-muted,#6b7280)}
.apb-rx-pfcards-media{overflow:hidden;display:block}
.apb-rx-pfcards-media img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;transition:transform var(--apb-rx-t-slow,.55s)}
.apb-rx-pfcards-card:hover .apb-rx-pfcards-media img{transform:scale(1.05)}
.apb-rx-pfcards-body{padding:16px 20px 20px;display:flex;flex-direction:column;gap:10px;flex:1}
.apb-rx-pfcards-body b{font-size:16.5px;font-weight:750;letter-spacing:-.01em;color:var(--apb-rx-ink,#0b0d12)}
.apb-rx-pfcards-body p{margin:0;font-size:13.5px;line-height:1.6;color:var(--apb-rx-muted,#6b7280)}
.apb-rx-pfcards-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:8px}
.apb-rx-pfcards-tag{font-size:11px;font-weight:600;color:var(--apb-rx-muted,#6b7280);background:var(--apb-rx-soft,#f4f5f7);
  border-radius:var(--apb-rx-radius-pill,999px);padding:4px 11px;white-space:nowrap}
@media(max-width:860px){.apb-rx-pfcards-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.apb-rx-pfcards-card,.apb-rx-pfcards-media img{transition:none}}

/* 6. Fullbleed snap */
.apb-rx-pfslides{padding:0;background:var(--apb-rx-ink,#0b0d12)}
.apb-rx-pfslides-scroller{height:min(88vh,860px);overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.apb-rx-pfslides-scroller::-webkit-scrollbar{display:none}
.apb-rx-pfslides-slide{position:relative;height:100%;scroll-snap-align:start;display:block;text-decoration:none;overflow:hidden}
.apb-rx-pfslides-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.apb-rx-pfslides-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,13,18,.35),transparent 30%,transparent 60%,rgba(11,13,18,.72))}
.apb-rx-pfslides-kick{position:absolute;top:clamp(18px,4vh,34px);left:clamp(18px,4vw,44px);z-index:1;display:flex;align-items:center;gap:12px;color:#fff}
.apb-rx-pfslides-kick i{font-style:normal;font-family:var(--apb-rx-font-display,inherit);font-weight:800;font-size:clamp(28px,4vw,44px);letter-spacing:-.03em;
  color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.8)}
.apb-rx-pfslides-kick span{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.apb-rx-pfslides-bar{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;align-items:flex-end;gap:18px;
  padding:clamp(18px,4vh,34px) clamp(18px,4vw,44px)}
.apb-rx-pfslides-bar b{font-family:var(--apb-rx-font-display,inherit);font-weight:800;font-size:clamp(22px,3.4vw,38px);
  letter-spacing:-.02em;color:#fff;line-height:1.1;display:block}
.apb-rx-pfslides-bar p{margin:2px 0 0;color:rgba(255,255,255,.75);font-size:13.5px;max-width:44ch;line-height:1.55}
.apb-rx-pfslides-bar .go{margin-left:auto;flex:none;display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;
  border-radius:50%;background:var(--apb-rx-brand);color:var(--apb-rx-accent-contrast,#fff);box-shadow:0 14px 34px -10px var(--apb-rx-glow);transition:transform var(--apb-rx-t-fast,.16s)}
.apb-rx-pfslides-slide:hover .go{transform:scale(1.1) rotate(45deg)}
.apb-rx-pfslides-bar .go svg{width:20px;height:20px}
.apb-rx-pfslides-hint{position:sticky;bottom:14px;z-index:2;display:flex;justify-content:center;pointer-events:none}
.apb-rx-pfslides-hint span{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,.8);background:rgba(11,13,18,.55);backdrop-filter:blur(8px);
  border-radius:var(--apb-rx-radius-pill,999px);padding:7px 14px}
.apb-rx-pfslides-hint svg{width:13px;height:13px;animation:apbrxPfslNudge calc(1.7s / var(--apb-rx-dur,1)) ease-in-out infinite}
@keyframes apbrxPfslNudge{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
@media(max-width:720px){.apb-rx-pfslides-bar{flex-direction:column;align-items:flex-start}.apb-rx-pfslides-bar .go{margin-left:0}}
@media (prefers-reduced-motion:reduce){.apb-rx-pfslides-hint svg{animation:none}.apb-rx-pfslides-slide:hover .go{transform:none}}

/* 7. Ticker index */
.apb-rx-pftick{padding:clamp(56px,10vh,110px) 0;background:var(--apb-rx-surface,#fff);overflow:hidden}
.apb-rx-pftick-head{max-width:1120px;margin:0 auto clamp(26px,4vh,44px);padding:0 24px;display:flex;align-items:baseline;gap:18px;flex-wrap:wrap}
.apb-rx-pftick-head .apb-rx-pf-head{margin:0;max-width:none;flex:1}
.apb-rx-pftick-note{margin-left:auto;font-size:12.5px;color:var(--apb-rx-muted,#6b7280)}
.apb-rx-pftick-row{border-top:var(--apb-rx-border,1px) solid var(--apb-rx-line,#e7e8ec);padding:clamp(14px,2.5vh,22px) 0;overflow:hidden;white-space:nowrap;
  -webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.apb-rx-pftick-row:last-child{border-bottom:var(--apb-rx-border,1px) solid var(--apb-rx-line,#e7e8ec)}
.apb-rx-pftick-track{display:inline-flex;align-items:center;gap:clamp(24px,4vw,48px);padding-right:clamp(24px,4vw,48px);
  animation:apbrxPftickL calc(36s / var(--apb-rx-dur,1)) linear infinite}
.apb-rx-pftick-row--rev .apb-rx-pftick-track{animation-name:apbrxPftickR;animation-duration:calc(44s / var(--apb-rx-dur,1))}
.apb-rx-pftick-row:hover .apb-rx-pftick-track{animation-play-state:paused}
@keyframes apbrxPftickL{to{transform:translateX(-50%)}}
@keyframes apbrxPftickR{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.apb-rx-pftick-item{display:inline-flex;align-items:center;gap:clamp(14px,2vw,24px);text-decoration:none}
.apb-rx-pftick-name{font-family:var(--apb-rx-font-display,inherit);font-weight:800;font-size:clamp(34px,6vw,72px);
  letter-spacing:-.03em;line-height:1;color:transparent;-webkit-text-stroke:1.5px color-mix(in srgb,var(--apb-rx-ink,#0b0d12) 55%,transparent);
  transition:color var(--apb-rx-t,.28s)}
.apb-rx-pftick-item:hover .apb-rx-pftick-name{color:var(--apb-rx-accent-text,var(--apb-rx-brand));-webkit-text-stroke:1.5px transparent}
.apb-rx-pftick-th{width:clamp(64px,7vw,104px);aspect-ratio:4/3;border-radius:calc(var(--apb-rx-radius) * .6);overflow:hidden;flex:none;
  box-shadow:var(--apb-rx-shadow-1);transform:rotate(-2deg);display:block}
.apb-rx-pftick-th img{width:100%;height:100%;object-fit:cover;display:block}
.apb-rx-pftick-dot{width:10px;height:10px;border-radius:50%;background:var(--apb-rx-brand);flex:none;display:inline-block}
.apb-rx-pftick .apb-rx-pf-ctarow{max-width:1120px;margin:clamp(26px,4vh,40px) auto 0;padding:0 24px}
@media (prefers-reduced-motion:reduce){
  .apb-rx-pftick-track{animation:none}
  .apb-rx-pftick-row{overflow-x:auto;-webkit-mask:none;mask:none}
  .apb-rx-pftick-name{color:var(--apb-rx-ink,#0b0d12);-webkit-text-stroke:0}
}

/* 8. Offset collage */
.apb-rx-pfoff{padding:clamp(64px,11vh,120px) 24px;background:var(--apb-rx-surface,#fff);overflow:hidden}
.apb-rx-pfoff-wrap{max-width:1080px;margin:0 auto}
.apb-rx-pfoff .apb-rx-pf-head h2{max-width:20ch}
.apb-rx-pfoff-stage{display:grid;grid-template-columns:repeat(12,1fr);gap:0;align-items:start}
.apb-rx-pfoff-piece{position:relative;text-decoration:none;display:block}
.apb-rx-pfoff-piece img{width:100%;display:block;border-radius:calc(var(--apb-rx-radius) * .6);box-shadow:var(--apb-rx-shadow-2);
  aspect-ratio:var(--apb-pf2-ar,4/5);object-fit:cover;transition:transform var(--apb-rx-t,.28s)}
.apb-rx-pfoff-piece:hover img{transform:translateY(-6px)}
.apb-rx-pfoff-cap{display:flex;gap:9px;align-items:baseline;padding:10px 2px 0;font-size:12.5px}
.apb-rx-pfoff-cap i{font-style:normal;font-weight:700;color:var(--apb-rx-fg-subtle,#a1a1aa);font-variant-numeric:tabular-nums}
.apb-rx-pfoff-cap b{font-weight:700;color:var(--apb-rx-ink,#0b0d12)}
.apb-rx-pfoff-quote{grid-column:2/8;grid-row:2;margin-top:8%;z-index:4}
.apb-rx-pfoff-quote blockquote{margin:0;font-family:var(--apb-rx-font-display,inherit);font-weight:700;
  font-size:clamp(20px,2.8vw,30px);letter-spacing:-.015em;line-height:1.3;color:var(--apb-rx-ink,#0b0d12)}
.apb-rx-pfoff-quote figcaption{margin-top:12px;font-size:13px;color:var(--apb-rx-muted,#6b7280)}
@media(max-width:760px){
  .apb-rx-pfoff-stage{display:flex;flex-direction:column;gap:22px}
  .apb-rx-pfoff-piece,.apb-rx-pfoff-quote{margin-top:0}
}
@media (prefers-reduced-motion:reduce){.apb-rx-pfoff-piece img{transition:none}}
