/* Walkers staging - works (開発事例一覧) SWELLネイティブ再現 */
#works-page{--wkw-orange:#E98212;--wkw-orange-d:#d8760f;--wkw-navy:#2B323B;--wkw-gray:#686868;--wkw-line:#E0E0E0;}

/* hero (navy banner) */
#works-page .wkw-hero{padding:64px 20px 72px;text-align:center;background:var(--wkw-navy);}
#works-page .wkw-hero__inner{max-width:760px;margin:0 auto;}
#works-page .wkw-hero__title{margin:0 0 22px;font-weight:900;font-size:clamp(28px,4vw,40px);color:#fff;}
#works-page .wkw-hero__lead{margin:0 0 34px;color:#d8dce1;line-height:1.9;font-size:15px;}
#works-page .wkw-hero__btns{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;}
#works-page .wkw-hbtn{display:inline-block;text-decoration:none;font-weight:800;font-size:16px;padding:16px 44px;border-radius:999px;transition:opacity .15s,transform .15s;line-height:1.4;}
#works-page .wkw-hbtn:hover{opacity:.85;transform:translateY(-2px);}
#works-page .wkw-hbtn--outline{color:#fff;background:transparent;border:1.5px solid #fff;}
#works-page .wkw-hbtn--solid{color:var(--wkw-navy);background:#fff;border:1.5px solid #fff;}

/* gallery */
#works-page .wkw-gallery{max-width:1140px;margin:0 auto;padding:64px 20px 90px;}
#works-page .wkw-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 28px;}

/* card */
#works-page .wkw-card{display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:opacity .15s;}
#works-page .wkw-card:hover{opacity:.7;}
#works-page .wkw-card__media{position:relative;border-radius:10px;overflow:hidden;background:#e9edf1;}
#works-page .wkw-card__media img{width:100%;aspect-ratio:1024/538;object-fit:cover;display:block;}
#works-page .wkw-label{position:absolute;top:10px;left:10px;z-index:2;color:#000;font-weight:700;font-size:14px;line-height:1.6;padding:6px 16px;border-radius:99px;background:#ffffffcc;}

#works-page .wkw-card__body{padding:16px 4px 0;}
#works-page .wkw-card__ttl{margin:0 0 10px;font-weight:800;font-size:18px;line-height:1.5;color:#1a1f26;}
#works-page .wkw-card__client{margin:0 0 14px;font-size:14px;color:var(--wkw-gray);}
#works-page .wkw-card__desc{margin:0 0 16px;font-size:14px;line-height:1.8;color:#4B4F58;}
#works-page .wkw-card__meta{margin:0;padding-top:16px;border-top:1px solid var(--wkw-line);}
#works-page .wkw-card__metarow{display:flex;gap:16px;margin:0 0 8px;font-size:14px;}
#works-page .wkw-card__metarow:last-child{margin-bottom:0;}
#works-page .wkw-card__metarow dt{flex:0 0 76px;margin:0;font-weight:700;color:#1a1f26;}
#works-page .wkw-card__metarow dd{margin:0;color:#4B4F58;}

@media (max-width:860px){#works-page .wkw-grid{grid-template-columns:repeat(2,1fr);gap:24px 18px;}}
@media (max-width:520px){#works-page .wkw-grid{grid-template-columns:1fr;}#works-page .wkw-hero__btns{gap:12px;}#works-page .wkw-hbtn{padding:14px 36px;}}