/* BAW v16 · Portafolio «Obras firmadas, en línea» (Sala 5 de #metodo-aureo) */
.pf-head{max-width:760px;margin-bottom:34px}
.pf-lead{font-size:18px;line-height:1.618;color:#F4F2FF;margin:0}
.pf-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:34px}
@media (min-width:760px){.pf-grid{grid-template-columns:1fr 1fr}}
.pf-card{display:flex;flex-direction:column;gap:13px;color:#FFFFFF;text-decoration:none;outline:none}
.pf-browser{position:relative;display:block;border-radius:13px;overflow:hidden;background:#FFFFFF;
  box-shadow:0 0 0 1px rgba(255,255,255,.35),0 13px 34px rgba(10,6,50,.35),0 34px 55px rgba(10,6,50,.2);
  transform:perspective(1200px) rotateX(2deg);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
.pf-bar{display:flex;align-items:center;gap:6px;height:30px;padding:0 13px;background:#EEF0F6;border-bottom:1px solid #DDE1EA}
.pf-bar i{width:9px;height:9px;border-radius:50%;background:#FF6B6B}
.pf-bar i:nth-child(2){background:#FFD43B}.pf-bar i:nth-child(3){background:#51CF66}
.pf-url{margin-left:13px;flex:1;max-width:260px;height:18px;border-radius:999px;background:#FFFFFF;font:500 11px/18px 'IBM Plex Mono',monospace;color:#4B5263;padding:0 10px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.pf-view{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:var(--pf1)}
/* miniatura animada: la página completa se recorre sola */
.pf-shot,.pf-paint{position:absolute;left:0;top:0;width:100%;will-change:transform}
.pf-shot{height:auto;display:block;animation:pfScroll 16s ease-in-out infinite alternate}
.pf-item:nth-child(2) .pf-shot,.pf-item:nth-child(2) .pf-paint{animation-delay:-4s}
.pf-item:nth-child(3) .pf-shot,.pf-item:nth-child(3) .pf-paint{animation-delay:-8s}
.pf-item:nth-child(4) .pf-shot,.pf-item:nth-child(4) .pf-paint{animation-delay:-12s}
@keyframes pfScroll{0%,12%{transform:translateY(0)}88%,100%{transform:translateY(var(--pf-end,-70%))}}
.pf-paint{display:none;height:300%;padding:0;animation:pfScroll 16s ease-in-out infinite alternate;--pf-end:-66.6%}
.pf-noimg .pf-shot{display:none}
.pf-noimg .pf-paint{display:flex;flex-direction:column}
.pf-nav{display:flex;align-items:center;gap:8px;height:7%;padding:0 6%;background:var(--pf1);color:#FFFFFF}
.pf-nav b{font:700 clamp(10px,1.2vw,14px) 'Space Grotesk',sans-serif;margin-right:auto}
.pf-nav em{width:8%;height:4px;border-radius:2px;background:rgba(255,255,255,.6)}
.pf-hero{display:flex;flex-direction:column;justify-content:center;gap:8%;height:26%;padding:0 8%;background:linear-gradient(135deg,var(--pf1),color-mix(in srgb,var(--pf1) 60%,var(--pf2)))}
.pf-hero strong{font:700 clamp(13px,1.9vw,24px)/1.15 'Space Grotesk',sans-serif;color:#FFFFFF;max-width:80%}
.pf-hero u{width:30%;height:clamp(14px,1.8vw,22px);border-radius:999px;background:#25D366}
.pf-rows{display:grid;grid-template-columns:repeat(3,1fr);gap:4%;padding:5% 6%;height:18%;background:#FFFFFF}
.pf-rows span{border-radius:8px;background:color-mix(in srgb,var(--pf2) 35%,#FFFFFF);box-shadow:inset 0 -30% 0 #F1F3F5}
.pf-band{height:20%;background:linear-gradient(120deg,var(--pf2),color-mix(in srgb,var(--pf2) 40%,var(--pf1)))}
.pf-foot{display:grid;place-items:center;flex:1;background:var(--pf1);color:#FFE36B;font:italic 22px Georgia,serif}
/* ficha bajo la miniatura */
.pf-meta{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"num name go" "rubro rubro rubro" "quote quote quote";align-items:baseline;column-gap:13px;row-gap:3px}
.pf-num{grid-area:num;font:500 12px 'IBM Plex Mono',monospace;color:#FFE36B;letter-spacing:.08em}
.pf-name{grid-area:name;font:700 22px/1.2 'Space Grotesk',sans-serif}
.pf-rubro{grid-area:rubro;font:500 12px 'IBM Plex Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:#D9D3FF}
.pf-quote{grid-area:quote;font:italic 16px/1.5 Georgia,'Times New Roman',serif;color:#F4F2FF}
.pf-go{grid-area:go;display:inline-flex;align-items:center;gap:6px;padding:6px 13px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);font:600 13px 'IBM Plex Sans',sans-serif;white-space:nowrap;transition:background .3s,color .3s}
.pf-card:hover .pf-browser,.pf-card:focus-visible .pf-browser{transform:perspective(1200px) rotateX(0) translateY(-6px);box-shadow:0 0 0 2px #FFE36B,0 21px 55px rgba(10,6,50,.45)}
.pf-card:hover .pf-go,.pf-card:focus-visible .pf-go{background:#FFE36B;color:#111126;border-color:#FFE36B}
.pf-card:hover .pf-shot,.pf-card:hover .pf-paint{animation-duration:8s}
.pf-card:focus-visible .pf-browser{outline:2px solid #FFE36B;outline-offset:4px}
.pf-cta{margin:55px auto 0;max-width:520px}
.ma-off .pf-shot,.ma-off .pf-paint,.m10-paused .pf-shot,.m10-paused .pf-paint{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.pf-shot,.pf-paint{animation:none!important}.pf-browser{transition:none}}
.ma-lite .pf-shot,.ma-lite .pf-paint{animation-duration:30s}