/* STEP 1: approved DARK CINEMATIC list only. All rules scoped to #works. */
#works{position:relative;isolation:isolate;background:#0A121C;color:#f3f6fa;font-family:Arial,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;scroll-margin-top:90px}
#works .pw-dark-zone{position:relative;isolation:isolate;background:radial-gradient(ellipse at 78% 10%,#152c4059,transparent 55%),linear-gradient(160deg,#0A121C,#0c1824 65%,#0A121C)}
#works .pw-dark-zone:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.035;background-image:repeating-linear-gradient(0deg,transparent 0 3px,#b9dffa 3px 4px)}
#works .pw-container{max-width:1392px;margin:0 auto;padding-left:32px;padding-right:32px}
#works .pw-intro{padding-top:40px}
#works .pw-kicker{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid #b9dffa3d;padding-bottom:15px;font:10px/1.7 monospace;letter-spacing:1.7px;color:#b9dffa}
#works .pw-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;padding:32px 0 22px}
#works h2{margin:0;font-size:clamp(76px,8.2vw,118px);line-height:.9;letter-spacing:-.07em;font-weight:800;color:#f8fafc}
#works h2 span{display:block}
#works .pw-heading p{font-size:13px;line-height:2;color:#a9bed0;margin:0 0 4px;max-width:310px}
#works .pw-draft{font-size:10px;line-height:1.9;color:#8ca5b9;margin:0 0 28px}
#works .pw-feature-grid,#works .pw-support-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}
#works .pw-feature-area{padding-bottom:44px}
#works .pw-card{min-width:0;scroll-margin-top:25px}
#works .pw-card-link{display:block}
#works .pw-image{position:relative;aspect-ratio:16/9;background:#132737;overflow:hidden}
#works .pw-image img{display:block;width:100%;height:100%;object-fit:contain;transform:scale(1);transition:transform .55s cubic-bezier(.22,1,.36,1);will-change:auto}
#works .pw-image:after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid #d0e7f222;transition:border-color .3s}
#works .pw-badge{position:absolute;left:14px;top:14px;z-index:1;background:#08121be8;color:#d3ebfc;font:9px/1.5 monospace;padding:6px 9px;letter-spacing:1.2px}
#works .pw-number{position:absolute;bottom:13px;right:14px;color:#fff;font:10px monospace;text-shadow:0 1px 6px #000;z-index:1}
#works .pw-placeholder{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:radial-gradient(ellipse at 65% 55%,#24465a66,transparent 70%),#102331;text-align:center;padding:24px;color:#b9dffa}
#works .pw-placeholder b{font:15px/1.6 monospace;letter-spacing:2px;font-weight:400}
#works .pw-placeholder small{font-size:11px;line-height:1.9;color:#91aabd}
#works .pw-card-meta{padding-top:16px}
#works .pw-meta-top{display:flex;justify-content:space-between;gap:16px;color:var(--subtle,#9ab6cb);font:9px/1.8 monospace;letter-spacing:1.2px}
#works .pw-card h3{font-size:var(--card-title,28px);line-height:1.35;letter-spacing:-.035em;font-weight:600;margin:7px 0 7px;color:var(--text,#f3f6fa);overflow-wrap:anywhere}
#works .pw-genre{font:10px/1.8 monospace;letter-spacing:.7px;color:var(--subtle,#9ab6cb);margin:0 0 12px}
#works .pw-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;width:max-content;min-width:165px;min-height:44px;padding:11px 0;border-bottom:1px solid var(--line,#b9dffa50);color:var(--accent,#b9dffa);font:10px/1.5 monospace;letter-spacing:1px;transition:color .25s,border-color .25s}
#works .pw-cta .pw-arrow{display:inline-block;transform:translateX(0);transition:transform .35s cubic-bezier(.22,1,.36,1)}
#works .pw-feature-grid .pw-card{--card-title:32px}
#works .pw-support-zone{--text:#edf3f8;--subtle:#9eb5c8;--accent:#b9dffa;--line:#b9dffa40;background:radial-gradient(ellipse at 20% 35%,#152a3b50,transparent 65%),#0A121C;border-top:1px solid #b9dffa22}
#works .pw-support-inner{max-width:1200px;padding:32px 32px 48px;margin:auto}
#works .pw-section-marker{display:flex;justify-content:space-between;gap:20px;margin:0 0 24px;padding-bottom:17px;border-bottom:1px solid var(--line);font:10px/1.6 monospace;color:var(--subtle);letter-spacing:1.4px}
#works .pw-support-grid{gap:34px 30px}
#works .pw-support-grid .pw-card{--card-title:26px}
@media(hover:hover) and (pointer:fine){#works .pw-card-link:hover .pw-image img{transform:scale(1.025)}
#works .pw-card-link:hover .pw-image:after{border-color:#b9dffaa0}
#works .pw-card-link:hover .pw-cta{border-color:var(--accent,#b9dffa);color:var(--text,#fff)}
#works .pw-card-link:hover .pw-arrow{transform:translateX(5px)}}
#works .pw-card-link:focus-visible .pw-image:after{border-color:#b9dffa}
@media(max-width:700px){#works .pw-container{padding-left:20px;padding-right:20px}
#works .pw-intro{padding-top:28px}
#works .pw-kicker{font-size:8px;letter-spacing:.8px;gap:12px;padding-bottom:13px}
#works .pw-heading{display:block;padding:25px 0 18px}
#works h2{font-size:64px;line-height:.91}
#works .pw-heading p{max-width:100%;font-size:12px;line-height:1.9;margin:23px 0 0}
#works .pw-draft{font-size:9px;line-height:1.9;margin-bottom:24px}
#works .pw-feature-grid,#works .pw-support-grid{grid-template-columns:1fr;gap:30px}
#works .pw-feature-area{padding-bottom:32px}
#works .pw-card-meta{padding-top:14px}
#works .pw-feature-grid .pw-card,#works .pw-support-grid .pw-card{--card-title:25px}
#works .pw-meta-top{font-size:8px;letter-spacing:.8px;gap:12px}
#works .pw-genre{font-size:9px;margin-bottom:8px}
#works .pw-cta{font-size:10px;min-width:165px}
#works .pw-badge{font-size:8px;left:10px;top:10px;padding:5px 8px}
#works .pw-number{right:10px;bottom:10px;font-size:9px}
#works .pw-support-inner{padding:25px 20px 34px}
#works .pw-section-marker{font-size:8px;letter-spacing:.8px;gap:10px;margin-bottom:24px;padding-bottom:14px}
#works .pw-placeholder{padding:18px;gap:9px}
#works .pw-placeholder b{font-size:13px}
#works .pw-placeholder small{font-size:10px}}
@media(max-width:350px){#works h2{font-size:54px}
#works .pw-kicker{font-size:7px;letter-spacing:.6px}
#works .pw-meta-top{letter-spacing:.3px}
#works .pw-placeholder b{font-size:12px;letter-spacing:1.2px}}
@media(prefers-reduced-motion:reduce){#works *,#works *:before,#works *:after{animation:none!important;transition:none!important}
#works .pw-card-link:hover .pw-image img{transform:none!important}
#works .pw-card-link:hover .pw-arrow{transform:none!important}}
#works .pw-card-surface{display:block;cursor:default}
#works .pw-cta{color:#9ab6cb;cursor:default;min-width:200px}
#works .pw-state{font-size:9px;letter-spacing:.4px;color:#9ab6cb}
@media(hover:hover) and (pointer:fine){#works .pw-card-surface:hover .pw-image img{transform:scale(1.025)}#works .pw-card-surface:hover .pw-image:after{border-color:#b9dffaa0}}
@media(prefers-reduced-motion:reduce){#works .pw-card-surface:hover .pw-image img{transform:none!important}}
