/* Page styles for /blog/, extracted from blog.html (all selectors start with .pg-blog) */
.pg-blog .phero .hx{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:40px;align-items:center}
.pg-blog .phero .scene{position:relative;width:100%;max-width:440px;justify-self:end}
.pg-blog .phero .scene svg{display:block;width:100%;height:auto;overflow:visible}
.pg-blog .phero .btns{display:flex;flex-wrap:wrap;gap:12px}
.pg-blog .phero .live{display:inline-flex;align-items:center;gap:8px;font:600 13px var(--mono);color:#9fe3c9;margin-top:18px}
.pg-blog .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-blog .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-blog .ph{display:inline-block;border:1.5px dashed var(--amber);background:#fff7e0;color:#6b4e00;border-radius:8px;padding:1px 8px;font-size:.92em}
.pg-blog .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-blog .phero .hx{grid-template-columns:1fr;gap:24px}.pg-blog .phero .scene{justify-self:start;max-width:340px}}

.pg-blog .thv{display:block;width:100%;height:100%}
.pg-blog .thv .orb{animation:thorb 14s linear infinite}
.pg-blog .thv .orb.o2{animation-duration:22s;animation-direction:reverse}
.pg-blog .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-blog .bh-c1{animation:bhf 6s ease-in-out infinite}
.pg-blog .bh-c2{animation:bhf 6s ease-in-out -2s infinite}
.pg-blog .bh-c3{animation:bhf 6s ease-in-out -4s infinite}
@keyframes bhf{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.pg-blog .bh-l{transform-box:fill-box;transform-origin:left;animation:bhl 5s ease-in-out infinite}
.pg-blog .bh-l.l2{animation-delay:.4s}.pg-blog .bh-l.l3{animation-delay:.8s}.pg-blog .bh-l.l4{animation-delay:1.2s}
@keyframes bhl{0%{transform:scaleX(0)}18%,86%{transform:scaleX(1)}100%{transform:scaleX(1)}}
.pg-blog .bh-cur{animation:bhcur 1s steps(2) infinite}
@keyframes bhcur{50%{opacity:0}}
.pg-blog .bh-dot{animation:bhcur 1.4s steps(2) infinite}
.pg-blog .bh-flow{animation:ilflow 1.1s linear infinite}
@keyframes ilflow{to{stroke-dashoffset:-22}}
.pg-blog .bh-bell{animation:bhbell 3s ease-in-out infinite;transform-origin:378px 40px;transform-box:view-box}
@keyframes bhbell{0%,70%,100%{transform:rotate(0)}76%{transform:rotate(14deg)}82%{transform:rotate(-12deg)}88%{transform:rotate(6deg)}}
.pg-blog .bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-bottom:22px}
.pg-blog .chips{position:relative;display:flex;flex-wrap:wrap;gap:8px}
.pg-blog .chip{position:relative;z-index:1;font:700 14px var(--body);color:#29344f;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:9px 15px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:color .25s,border-color .25s,background .25s,transform .35s cubic-bezier(.34,1.56,.64,1)}
.pg-blog .chip .n{font:700 12px var(--mono);background:#eef1f4;color:var(--sub);border-radius:999px;padding:1px 7px;transition:background .25s,color .25s}
.pg-blog .chip[aria-pressed="true"]{color:#fff;background:var(--blue);border-color:var(--blue);transform:translateY(-2px)}
.pg-blog .chip[aria-pressed="true"] .n{background:rgba(255,255,255,.2);color:#fff}
.pg-blog .chip.pop{animation:bpop .45s cubic-bezier(.34,1.56,.64,1)}
@keyframes bpop{0%{transform:scale(1)}40%{transform:scale(1.12)}100%{transform:scale(1) translateY(-2px)}}
.pg-blog .cnt{font:600 13px var(--mono);color:var(--sub);margin:0}
.pg-blog .grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;grid-auto-flow:dense}
.pg-blog .bc{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .4s cubic-bezier(.34,1.56,.64,1),box-shadow .35s,opacity .3s}
.pg-blog .bc .th{display:block;aspect-ratio:16/9;overflow:hidden}
.pg-blog .bc .th svg{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.pg-blog .bc .bb{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px;flex:1}
.pg-blog .bc .tags{display:flex;flex-wrap:wrap;gap:6px}
.pg-blog .bc .tags span{font:700 12px var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--blue);background:#e6f1f8;border-radius:999px;padding:2px 9px}
.pg-blog .bc h3{font-size:20px;line-height:1.28}
.pg-blog .bc p{margin:0;color:var(--sub);font-size:15.5px}
.pg-blog .bc .ft{margin-top:auto;padding-top:8px;display:flex;justify-content:space-between;align-items:center;font-size:14px;color:var(--sub)}
.pg-blog .bc .go{font:800 14px var(--display);color:var(--blue);display:inline-flex;gap:6px;align-items:center}
.pg-blog .bc .go b{display:inline-block;transition:transform .3s}
.pg-blog a.bc:hover{transform:translateY(-8px);box-shadow:0 26px 44px -24px rgba(4,36,58,.5)}
.pg-blog a.bc:hover .th svg{transform:scale(1.06)}
.pg-blog a.bc:hover .ic{animation:thic .9s ease-in-out infinite}
.pg-blog a.bc:hover .go b{transform:translateX(5px)}
.pg-blog .bc.feat{grid-column:span 2}
.pg-blog .bc.feat{flex-direction:row}
.pg-blog .bc.feat .th{flex:1.1;aspect-ratio:auto;min-height:280px}
.pg-blog .bc.feat .bb{flex:1;padding:26px}
.pg-blog .bc.feat h3{font-size:25px}
.pg-blog .bc.feat p{font-size:17px}
.pg-blog .bc .new{position:absolute;top:14px;left:14px;font:800 12px var(--mono);letter-spacing:.06em;color:#fff;background:var(--ok);border-radius:999px;padding:4px 10px;display:inline-flex;gap:6px;align-items:center}
.pg-blog .bc .new i{width:7px;height:7px;border-radius:50%;background:#fff;animation:bhcur 1.4s steps(2) infinite}
.pg-blog .bc.soon{border:2px dashed var(--amber);background:#fffbef}
.pg-blog .bc.soon .th{opacity:.55;filter:saturate(.6)}
.pg-blog .bc.soon .tags span{background:#fff0c9;color:#6b4e00}
.pg-blog .bc.out{opacity:0;transform:scale(.92) translateY(10px)}
.pg-blog .bc[hidden]{display:none}
.pg-blog .empty{grid-column:1/-1;text-align:center;color:var(--sub);padding:30px;border:2px dashed var(--line);border-radius:18px}
.pg-blog .news{margin-top:40px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:22px;align-items:center;background:#fffbef;border:2px dashed var(--amber);border-radius:22px;padding:24px 26px}
.pg-blog .news svg{width:64px;height:64px}
.pg-blog .news .env{animation:bhf 3s ease-in-out infinite}
.pg-blog .news h3{font-size:22px;margin-bottom:4px}
.pg-blog .news p{margin:0;color:#6b4e00}
.pg-blog .news .pill{font:700 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#6b4e00;background:#fff0c9;border-radius:999px;padding:6px 12px;white-space:nowrap}
@media (max-width:980px){.pg-blog .grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.pg-blog .grid{grid-template-columns:1fr}.pg-blog .bc.feat{grid-column:auto;flex-direction:column}.pg-blog .bc.feat .th{aspect-ratio:16/9;min-height:0}.pg-blog .bc.feat .bb{padding:18px 20px 20px}.pg-blog .bc.feat h3{font-size:21px}.pg-blog .news{grid-template-columns:1fr;text-align:left}}
