/* Work — page-specific styles (converted from work.html <style>) */

@keyframes tsInfinityBorder { to { stroke-dashoffset: 0; } }

.dsmt-filters { display: flex; gap: 8px; flex-wrap: wrap; padding: 20px var(--dsmt-gutter); border-bottom: 1px solid var(--dsmt-line); background: var(--dsmt-bg); max-width: 100%; }
.dsmt-filters-inner { max-width: var(--dsmt-max); margin: 0 auto; width: 100%; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.dsmt-filters-label { font-family: var(--dsmt-font-mono); font-size: 0.67rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--dsmt-ink-3); margin-right: 8px; }
.dsmt-works-list { max-width: var(--dsmt-max); margin: 0 auto; padding: 0 var(--dsmt-gutter); }
.dsmt-case-row {
  display: grid; grid-template-columns: 180px minmax(200px,440px) minmax(160px,320px) 1fr 36px;
  gap: 24px; padding: 28px 0; border-bottom: 1px solid var(--dsmt-line);
  align-items: center; text-decoration: none; color: inherit;
  transition: background 0.2s, padding-left 0.2s, padding-right 0.2s;
  border-radius: 0;
}
.dsmt-case-row:hover { background: var(--dsmt-bg-2); padding-left: 16px; padding-right: 16px; border-radius: var(--dsmt-radius); }
.dsmt-case-row-static:hover { background: none; padding-left: 0; padding-right: 0; }
.dsmt-case-row-static { cursor: default; }
@media(max-width:900px){
  .dsmt-case-row { grid-template-columns: 1fr; gap: 10px; }
  .dsmt-case-row .dsmt-case-read { display: none; }
  .dsmt-case-row .dsmt-case-img { margin-bottom: 8px; border: 1px solid var(--dsmt-line); box-shadow: 0 2px 10px rgba(0,0,0,0.06); }
  .dsmt-case-row .dsmt-case-arr { text-align: left; }
}
.dsmt-case-img { aspect-ratio: 4/3; border-radius: var(--dsmt-radius); }
.dsmt-case-row h3 { font-family: var(--dsmt-font-head); font-weight: 700; font-size: clamp(1.1rem,1.8vw,1.5rem); letter-spacing: -0.025em; line-height: 1.15; margin: 0 0 6px; }
.dsmt-case-desc { font-size: 0.85rem; color: var(--dsmt-ink-2); line-height: 1.55; max-width: 44ch; }
.dsmt-case-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.dsmt-case-read { font-family: var(--dsmt-font-mono); font-size: 0.67rem; color: var(--dsmt-ink-3); text-align: right; }
.dsmt-case-arr { font-size: 18px; text-align: right; color: var(--dsmt-ink-3); transition: transform 0.2s, color 0.2s; }
.dsmt-case-row:hover .dsmt-case-arr { transform: translateX(4px); color: var(--dsmt-blue); }
.dsmt-callout { background: var(--dsmt-dark); border-radius: var(--dsmt-radius-xl); padding: 40px 48px; display: grid; grid-template-columns: 1fr auto; gap: 32px; align-items: center; margin: 48px 0; position: relative; overflow: hidden; }
@media(max-width:720px){ .dsmt-callout { grid-template-columns: 1fr; padding: 32px; } }
.dsmt-callout h3 { font-family: var(--dsmt-font-head); font-weight: 700; font-size: clamp(1.3rem,2.5vw,2rem); letter-spacing: -0.03em; color: #fff; margin-bottom: 8px; }
.dsmt-callout h3 span { color: var(--dsmt-blue); }
.dsmt-callout p { font-size: 0.9rem; color: rgba(255,255,255,0.5); line-height: 1.65; }
