/* ==========================================================================
   CASE STUDY — page-specific layout
   ========================================================================== */

.cs-hero{
  min-height:100vh;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding-top:140px;
  padding-bottom:64px;
}
.cs-hero-meta{
  display:flex;
  flex-wrap:wrap;
  gap:32px 56px;
  margin-top:40px;
  padding-top:24px;
  border-top:1px solid var(--line);
}
.cs-hero-meta div{ display:flex; flex-direction:column; gap:6px; }

.cs-section{ border-top:1px solid var(--line); }
.cs-section-inner{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:48px;
  padding:clamp(56px,8vw,120px) 0;
}
.cs-section-inner .body-lg{ max-width:60ch; color:var(--paper); font-weight:400; }
@media (max-width:900px){ .cs-section-inner{ grid-template-columns:1fr; gap:24px; } }

.cs-numbers{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px,1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.cs-swatches{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(140px,1fr));
  gap:16px;
}
.cs-swatch{ text-align:left; }
.cs-swatch .fill{ aspect-ratio:1/1; border:1px solid var(--line); }
.cs-swatch .label{ margin-top:10px; }
.cs-number{ background:var(--ink); padding:32px 24px; }
.cs-number .num{ font-family:var(--font-display); font-size:clamp(2rem,3.4vw,3rem); text-transform:uppercase; }
.cs-number .label{ margin-top:8px; }

.cs-gallery{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:var(--line);
}
.cs-gallery-slot{
  aspect-ratio:4/3;
  background:var(--ink-raise);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:24px;
}
.cs-gallery-slot img{ width:100%; height:100%; object-fit:cover; }

.cs-next{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:24px;
  padding:clamp(48px,8vw,96px) 0;
}
.cs-next h3{ text-transform:uppercase; }
