.pcards{--pc-line:var(--hair-2);border-top:1px solid var(--pc-line);border-left:1px solid var(--pc-line);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.pcard{border-right:1px solid var(--pc-line);border-bottom:1px solid var(--pc-line)}.pcard[hidden]{display:none}.pcard{isolation:isolate;min-height:clamp(380px,31vw,470px);padding:18px var(--pad) 26px;color:var(--ink);transition:color .4s var(--ease) .1s;background:0 0;flex-direction:column;justify-content:space-between;gap:clamp(36px,6vw,88px);display:flex;position:relative;overflow:hidden}.pcard:before{content:"";z-index:-2;background:var(--blue);transform-origin:50% 100%;transition:transform .6s var(--ease);position:absolute;inset:0;transform:scaleY(0)}.pcard>.pc-top,.pcard>.pc-body{z-index:1;position:relative}.pc-orb{--W:clamp(520px, 50vw, 720px);z-index:-1;width:var(--W);aspect-ratio:1;height:auto;right:calc(var(--pad) + 11px);pointer-events:none;transition:opacity .5s var(--ease);position:absolute;top:28px;transform:translate(50%,-50%)}.pc-orb>circle:not(.dg-ring){display:none}.pc-orb-b{color:var(--blue);--dot:var(--blue);opacity:.32}.pc-orb-l{color:var(--lime);--dot:var(--lime);opacity:0}.pcard:hover .pc-orb-b,.pcard:focus-visible .pc-orb-b{opacity:0}.pcard:hover .pc-orb-l,.pcard:focus-visible .pc-orb-l{opacity:.6}.pc-ic :is(path,circle,rect,ellipse){stroke-dasharray:1;stroke-dashoffset:0}@keyframes pc-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}.pc-top{justify-content:space-between;align-items:flex-start;display:flex}.pc-ic{aspect-ratio:1;width:clamp(46px,4vw,64px);height:auto;color:var(--blue);transform-origin:0 0;transition:color .4s var(--ease), transform .6s var(--ease)}.pc-n{letter-spacing:.02em;font-feature-settings:"zero" 1;color:var(--blue);transition:color .4s var(--ease);font-size:.8rem;font-weight:600}.pc-body{flex-direction:column;gap:12px;display:flex}.pc-meta{letter-spacing:.02em;text-transform:uppercase;color:var(--ink-3);transition:color .4s var(--ease);flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:.7rem;display:flex}.pc-cat{border:1px solid var(--blue);border-radius:var(--r-btn);color:var(--blue);letter-spacing:.03em;transition:border-color .4s var(--ease), color .4s var(--ease);padding:4px 9px 3px;font-size:.68rem}.pc-h{font-family:var(--font-display);letter-spacing:-.03em;color:inherit;margin:4px 0 0;font-size:clamp(1.3rem,1.7vw,1.9rem);font-weight:500;line-height:1.08}.pc-ex{color:var(--ink-2);-webkit-line-clamp:3;transition:color .4s var(--ease);-webkit-box-orient:vertical;margin:0;font-size:.9rem;line-height:1.5;display:-webkit-box;overflow:hidden}.pc-read{--b-fill:var(--blue);--b-ink:#fff;--b-line:var(--blue);letter-spacing:.02em;text-transform:uppercase;min-height:42px;transition:color .4s var(--ease);flex-direction:row-reverse;align-self:flex-start;align-items:stretch;gap:4px;margin-top:8px;font-size:.78rem;line-height:1;display:inline-flex}.pc-read>span{background:var(--b-fill);color:var(--b-ink);border-radius:var(--r-btn);transition:background .4s var(--ease), color .4s var(--ease);align-items:center;padding:0 16px;display:inline-flex}.pcard:hover,.pcard:focus-visible{color:#fff}.pcard:hover:before,.pcard:focus-visible:before{transform:scaleY(1)}.pcard:hover .pc-ic :is(path,circle,rect,ellipse),.pcard:focus-visible .pc-ic :is(path,circle,rect,ellipse){animation:pc-draw 1s var(--ease) .2s both}@media (prefers-reduced-motion:reduce){.pcard:before,.pc-ic{transition:none}.pcard:hover .pc-ic{transform:none}.pcard:hover .pc-ic :is(path,circle,rect,ellipse){animation:none}}.pcard:hover :is(.pc-ic,.pc-n),.pcard:focus-visible :is(.pc-ic,.pc-n){color:var(--lime)}.pcard:hover .pc-ic,.pcard:focus-visible .pc-ic{transform:scale(1.22)}.pcard:hover .pc-meta,.pcard:focus-visible .pc-meta{color:#ffffffc7}.pcard:hover .pc-cat,.pcard:focus-visible .pc-cat{border-color:var(--lime);color:var(--lime)}.pcard:hover .pc-ex,.pcard:focus-visible .pc-ex{color:#ffffffd6}.pcard:hover .pc-read,.pcard:focus-visible .pc-read{--b-fill:var(--lime);--b-ink:var(--blue);--b-line:var(--lime)}.pcard:hover .pc-read>.dot-btn,.pcard:focus-visible .pc-read>.dot-btn{background:var(--b-line);color:var(--b-ink)}.pcard:hover .pc-read>.dot-btn:after,.pcard:focus-visible .pc-read>.dot-btn:after{transform:rotate(405deg)}@media (width<=960px){.pcards{grid-template-columns:minmax(0,1fr)}.pcard{gap:40px;min-height:0}.pc-orb{--W:440px}}
