/* =============================================================
   Blackbird — Work index
   ============================================================= */

/* Header */
.bb-work-head { padding: 112px 64px 64px; max-width: 1600px; margin: 0 auto; }
.bb-work-head__meta { display: flex; flex-wrap: wrap; gap: 32px; font-family: var(--mono); font-size: 10px; letter-spacing: 0.22em; font-weight: 500; text-transform: uppercase; color: var(--chalk); padding: 18px 0; border-top: 1px solid var(--line-d); border-bottom: 1px solid var(--line-d); }
.bb-work-head__meta span:first-child { color: var(--signal); }
.bb-work-head__title { font-family: var(--font-display); font-weight: 700; font-size: clamp(72px, 12vw, 220px); letter-spacing: -0.04em; line-height: 0.86; margin: 64px 0 32px; color: var(--chalk); }
.bb-work-head__tag { font-family: var(--font-display); font-weight: 500; font-size: clamp(18px, 1.6vw, 24px); letter-spacing: -0.01em; line-height: 1.4; max-width: 680px; color: var(--chalk); opacity: 0.72; margin: 0; }

/* Grid */
.bb-work-grid { max-width: 1600px; margin: 0 auto; padding: 64px 64px 120px; display: grid; grid-template-columns: 1fr 1fr; gap: 64px 48px; border-top: 1px solid var(--line-d); padding-top: 64px; }

/* Card */
.bb-work-card { display: flex; flex-direction: column; gap: 18px; text-decoration: none; color: inherit; position: relative; }
.bb-work-card.is-placeholder { opacity: 0.55; }
.bb-work-card__fig { margin: 0; position: relative; overflow: hidden; background: var(--ink-2); }
.bb-work-card__fig img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 900ms var(--ease-out), filter 300ms; }
.bb-work-card:hover .bb-work-card__fig img { transform: scale(1.04); }
.bb-work-card__ph { width: 100%; height: 100%; display: flex; flex-direction: column; gap: 12px; align-items: center; justify-content: center; color: var(--mute-d); font-family: var(--mono); font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; }
.bb-work-card__soon { position: absolute; top: 14px; left: 14px; font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em; font-weight: 500; text-transform: uppercase; color: var(--chalk); padding: 6px 10px; background: rgba(10,10,10,0.55); backdrop-filter: blur(10px); }

.bb-work-card__meta { display: flex; flex-direction: column; }
.bb-work-card__title { font-family: var(--font-display); font-weight: 500; font-size: clamp(20px, 1.8vw, 28px); letter-spacing: -0.02em; line-height: 1.1; color: var(--chalk); margin: 0; transition: color 220ms; }
.bb-work-card:not(.is-placeholder):hover .bb-work-card__title { color: var(--signal); }
.bb-work-card__x { font-weight: 400; color: var(--chalk); opacity: 0.55; }

/* CTA band */
.bb-work-cta { border-top: 1px solid var(--line-d); border-bottom: 1px solid var(--line-d); }
.bb-work-cta__inner { max-width: 1600px; margin: 0 auto; padding: 120px 64px; display: flex; flex-direction: column; gap: 32px; align-items: flex-start; }
.bb-work-cta__title { font-family: var(--font-display); font-weight: 700; font-size: clamp(56px, 8vw, 140px); letter-spacing: -0.035em; line-height: 0.9; color: var(--chalk); margin: 0; }
.bb-work-cta__link { font-family: var(--font-display); font-weight: 500; font-size: clamp(20px, 2vw, 28px); color: var(--signal); text-decoration: none; letter-spacing: -0.01em; border-bottom: 1px solid currentColor; padding-bottom: 4px; transition: opacity 200ms; }
.bb-work-cta__link:hover { opacity: 0.7; }
.bb-work-cta__link span { display: inline-block; margin-left: 10px; transition: transform 280ms var(--ease-out); }
.bb-work-cta__link:hover span { transform: translateX(6px); }

/* Responsive */
@media (max-width: 900px) {
  .bb-work-head, .bb-work-grid { padding-left: 24px; padding-right: 24px; }
  .bb-work-cta__inner { padding: 72px 24px; }
  .bb-work-grid { grid-template-columns: 1fr; gap: 48px; }
}