/* Blog post styles.  Merged from the three prototype posts (identical after renaming .pg-blog-{slug} to .pg-post) */
.pg-post .phero .hx{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:40px;align-items:center}
.pg-post .phero .scene{position:relative;width:100%;max-width:440px;justify-self:end}
.pg-post .phero .scene svg{display:block;width:100%;height:auto;overflow:visible}
.pg-post .phero .btns{display:flex;flex-wrap:wrap;gap:12px}
.pg-post .phero .live{display:inline-flex;align-items:center;gap:8px;font:600 13px var(--mono);color:#9fe3c9;margin-top:18px}
.pg-post .phero .live i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(18,145,107,.6);animation:pgblink 1.8s ease-out infinite}
.pg-post .phero::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.06) 1px,transparent 1.2px);background-size:22px 22px;mask-image:linear-gradient(90deg,transparent,#000 60%)}
.pg-post .ph{display:inline-block;border:1.5px dashed var(--amber);background:#fff7e0;color:#6b4e00;border-radius:8px;padding:1px 8px;font-size:.92em}
.pg-post .phero .ph{background:rgba(245,165,36,.12);color:#ffd58a}
@keyframes pgblink{0%{box-shadow:0 0 0 0 rgba(18,145,107,.7)}100%{box-shadow:0 0 0 10px rgba(18,145,107,0)}}
@media (max-width:860px){.pg-post .phero .hx{grid-template-columns:1fr;gap:24px}.pg-post .phero .scene{justify-self:start;max-width:340px}}

.pg-post .thv{display:block;width:100%;height:100%}
.pg-post .thv .orb{animation:thorb 14s linear infinite}
.pg-post .thv .orb.o2{animation-duration:22s;animation-direction:reverse}
.pg-post .thv .pr{animation:thpr 3.2s ease-out infinite}
@keyframes thorb{to{transform:rotate(360deg)}}
@keyframes thpr{0%{transform:scale(1);opacity:.35}100%{transform:scale(1.7);opacity:0}}
@keyframes thic{0%{transform:scale(1)}40%{transform:scale(1.14)}100%{transform:scale(1)}}

.pg-post .il svg{display:block;width:100%;height:auto;overflow:visible}
.pg-post .il-d{animation:ild 6s ease-in-out infinite}
.pg-post .il-d.d2{animation-delay:.12s}.pg-post .il-d.d3{animation-delay:.24s}.pg-post .il-d.d4{animation-delay:.36s}.pg-post .il-d.d5{animation-delay:.48s}.pg-post .il-d.d6{animation-delay:.6s}
@keyframes ild{0%,4%{opacity:0}10%,100%{opacity:1}}
.pg-post .il-flow{animation:ilflow 1s linear infinite}
@keyframes ilflow{to{stroke-dashoffset:-22}}
.pg-post .il-num{animation:ilnum 6s ease-in-out infinite;transform-origin:312px 138px;transform-box:view-box}
@keyframes ilnum{0%,30%{transform:scale(1)}36%{transform:scale(1.25)}44%,100%{transform:scale(1)}}
.pg-post .il-ring{animation:ilring 6s ease-out infinite;transform-origin:312px 189px;transform-box:view-box;opacity:0}
@keyframes ilring{0%,50%{opacity:0;transform:scale(.6)}56%{opacity:1}72%,100%{opacity:0;transform:scale(1.6)}}
.pg-post .il-shield{animation:ilsh 6s ease-in-out infinite;transform-origin:190px 44px;transform-box:view-box}
@keyframes ilsh{0%,58%{transform:scale(1)}64%{transform:scale(1.18)}72%,100%{transform:scale(1)}}
.pg-post .il-phone{animation:ilfloat 4s ease-in-out infinite}
@keyframes ilfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.pg-post .il-led{animation:illed 1.4s steps(2) infinite}.pg-post .il-led.l2{animation-delay:.4s}.pg-post .il-led.l3{animation-delay:.9s}
@keyframes illed{50%{opacity:.25}}
.pg-post .il-file{opacity:0;animation:ilfile 3.6s ease-in-out infinite}
.pg-post .il-file.f2{animation-delay:1.2s}.pg-post .il-file.f3{animation-delay:2.4s}
@keyframes ilfile{0%{opacity:0;transform:translate(0,0)}10%{opacity:1}70%{opacity:1;transform:translate(96px,-26px)}85%,100%{opacity:0;transform:translate(110px,-28px)}}
.pg-post .il-spin{animation:ilspin 7s linear infinite;transform-origin:290px 110px;transform-box:view-box}
@keyframes ilspin{to{transform:rotate(360deg)}}
.pg-post .il-bar{animation:ilbar 6s cubic-bezier(.4,0,.2,1) infinite}
@keyframes ilbar{0%{transform:scaleX(.02)}70%,100%{transform:scaleX(1)}}
.pg-post .il-pass{animation:ilpass 6s ease-out infinite}
@keyframes ilpass{0%,66%{opacity:0}74%,96%{opacity:1}100%{opacity:0}}
.pg-post .il-paper{animation:ilpaper 7s cubic-bezier(.2,.8,.2,1) infinite}
@keyframes ilpaper{0%{transform:translateY(70px)}18%,90%{transform:translateY(0)}100%{transform:translateY(70px)}}
.pg-post .il-mag{transform:translate(170px,124px);animation:ilmag 7s ease-in-out infinite}
@keyframes ilmag{0%,18%{transform:translate(250px,40px)}34%{transform:translate(110px,124px)}48%,86%{transform:translate(170px,124px)}100%{transform:translate(250px,40px)}}
.pg-post .il-hl{animation:ilhl 7s ease-in-out infinite}
@keyframes ilhl{0%,40%{opacity:.35}46%,52%,58%{opacity:1}49%,55%{opacity:.4}62%,100%{opacity:1}}
.pg-post .il-flag{animation:ilflag 7s cubic-bezier(.34,1.56,.64,1) infinite;transform-origin:292px 250px;transform-box:view-box}
@keyframes ilflag{0%,46%{transform:scaleY(.2)}56%,92%{transform:scaleY(1)}100%{transform:scaleY(.2)}}
.pg-post .il-cloth{animation:ilwave 1.2s ease-in-out infinite;transform-origin:294px 94px;transform-box:view-box}
@keyframes ilwave{0%,100%{transform:skewY(0)}50%{transform:skewY(-5deg)}}
.pg-post .il-call{animation:ilcall 7s ease-out infinite;transform-origin:292px 250px;transform-box:view-box}
@keyframes ilcall{0%,60%{transform:scale(1)}66%{transform:scale(1.25)}74%,100%{transform:scale(1)}}

.pg-post .rp{position:fixed;top:0;left:0;right:0;height:4px;z-index:80;pointer-events:none}
.pg-post .rp b{display:block;height:100%;background:linear-gradient(90deg,var(--blue-hi),#3fd3a2);transform-origin:left;transform:scaleX(0);box-shadow:0 0 10px rgba(63,169,245,.8)}
.pg-post .phero h1{font-size:clamp(30px,4vw,46px)}
.pg-post .meta{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;font-size:14px;color:#c9d4e5;margin-top:4px}
.pg-post .meta .tg{font:700 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--blue-hi);background:rgba(63,169,245,.12);border:1px solid rgba(63,169,245,.35);border-radius:999px;padding:3px 10px;text-decoration:none}
.pg-post .phero .il{max-width:400px}
.pg-post .art{padding:48px 0 8px}
.pg-post .agrid{display:grid;grid-template-columns:230px minmax(0,1fr);gap:56px;align-items:start}
.pg-post .toc{position:sticky;top:calc(var(--hh,64px) + 22px);align-self:start}
.pg-post .toc summary{font:700 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--sub);list-style:none;cursor:pointer;padding:6px 0;border-radius:6px}
.pg-post .toc summary::-webkit-details-marker{display:none}
.pg-post .toc .tw{position:relative;margin-top:10px}
.pg-post .toc ol{list-style:none;margin:0;padding:0 0 0 12px;border-left:2px solid var(--line)}
.pg-post .toc .ind{position:absolute;left:0;z-index:1;top:0;width:2px;height:0;background:var(--blue);border-radius:2px;transition:top .35s cubic-bezier(.2,.8,.2,1),height .35s}
.pg-post .toc a{display:block;font-size:14px;line-height:1.35;color:var(--sub);text-decoration:none;padding:7px 10px;border-radius:8px;transition:color .25s,background .25s,transform .25s}
.pg-post .toc a.on{color:var(--blue);background:#e6f1f8;font-weight:600;transform:translateX(3px)}
.pg-post .toc .pct{margin-top:14px;font:600 12px var(--mono);color:var(--sub)}
.pg-post .body{max-width:720px;font-size:18px;line-height:1.72;color:#1f2833}
.pg-post .body h2{font-size:clamp(23px,2.6vw,28px);margin:46px 0 12px;letter-spacing:-.01em}
.pg-post .body p{margin:0 0 18px}
.pg-post .body ul,.pg-post .body ol{padding-left:24px;margin:0 0 22px}
.pg-post .body li{margin:0 0 10px;padding-left:4px}
.pg-post .body li::marker{color:var(--blue);font-weight:700}
.pg-post .body .lede{font-size:21px;line-height:1.6;color:#27313c}
.pg-post .orig{font-size:14px;color:var(--sub);margin:0 0 18px}
.pg-post .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:26px 0 8px}
.pg-post .stat{position:relative;overflow:hidden;background:var(--g-dark);color:#dfe6ee;border-radius:16px;padding:20px 20px 16px}
.pg-post .stat::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.2px);background-size:16px 16px}
.pg-post .stat b{position:relative;display:block;font:800 40px/1 var(--display);color:var(--blue-hi);margin-bottom:8px}
.pg-post .stat span{position:relative;display:block;font-size:16px;line-height:1.45}
.pg-post .stat small{position:relative;display:block;font:500 12px var(--mono);color:#8b96a3;margin-top:10px}
.pg-post .stat i{position:absolute;right:16px;top:18px;width:8px;height:8px;border-radius:50%;background:var(--alert);animation:pgblink2 1.6s ease-out infinite}
@keyframes pgblink2{0%{box-shadow:0 0 0 0 rgba(255,107,74,.7)}100%{box-shadow:0 0 0 10px rgba(255,107,74,0)}}
.pg-post .tip{position:relative;background:#eaf5fd;border:1px solid #cfe6f7;border-left:5px solid var(--blue-hi);border-radius:14px;padding:16px 18px 16px 20px;margin:24px 0;font-size:17px}
.pg-post .tip strong{color:var(--blue-ink)}
.pg-post .planc{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:34px 0 0;padding:16px 18px;background:#fff;border:1px solid var(--line);border-radius:16px}
.pg-post .planc .lab{font:700 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--sub)}
.pg-post .planc a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font:800 15px var(--display);color:var(--blue-ink);background:#e6f1f8;border:1.5px solid #b9dbf2;border-radius:999px;padding:7px 14px;transition:transform .3s cubic-bezier(.34,1.56,.64,1),background .25s}
.pg-post .planc a:hover{transform:translateY(-2px);background:#d6ebf9}
.pg-post .planc a i{width:8px;height:8px;border-radius:50%;background:var(--ok)}
.pg-post .planc span.w{font-size:15px;color:var(--sub)}
.pg-post .endcta{margin:28px 0 0;padding:22px;border-radius:18px;background:linear-gradient(135deg,#04243a,#026399);color:#fff;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.pg-post .endcta p{margin:0;font:700 18px var(--display);max-width:26em}
.pg-post .rel h2{margin-top:0}
.pg-post .relg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.pg-post .rc{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .35s}
.pg-post .rc .th{aspect-ratio:16/7;overflow:hidden;background:#123}
.pg-post .rc .bb{padding:16px 18px 18px}
.pg-post .rc h3{font-size:19px;line-height:1.3;margin:6px 0 6px}
.pg-post .rc p{margin:0;color:var(--sub);font-size:15px}
.pg-post .rc .t{font:700 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.pg-post .rc:hover{transform:translateY(-6px);box-shadow:0 22px 40px -22px rgba(4,36,58,.45)}
.pg-post .rc:hover .ic{animation:thic .9s ease-in-out infinite}
@media (max-width:900px){
 .pg-post .agrid{grid-template-columns:1fr;gap:18px}
 .pg-post .toc{position:static;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 14px}
 .pg-post .toc summary{display:flex;justify-content:space-between;align-items:center}
 .pg-post .toc summary::after{content:"+";font-size:18px;color:var(--blue);transition:transform .3s}
 .pg-post .toc[open] summary::after{transform:rotate(45deg)}
 .pg-post .toc .pct{display:none}
 .pg-post .body{font-size:17px}
 .pg-post .relg{grid-template-columns:1fr}
}
@media (min-width:901px){.pg-post .toc summary{pointer-events:none}}
