/* case-study-responsive.css - Multi-Device Responsiveness for V2 Case Studies */

/* --- TABLET (768px - 1023px) --- */
@media (max-width: 1023px) {
  .case-body-layout {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }

  .section-rail {
    display: none !important;
  }

  .tldr-grid {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .editorial-grid {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }

  .grid-4-8 .col-text,
  .grid-4-8 .col-visual,
  .grid-5-7 .col-text,
  .grid-5-7 .col-visual,
  .grid-3-9 .col-text,
  .grid-3-9 .col-visual,
  .grid-6-6 .col-left,
  .grid-6-6 .col-right,
  .grid-12 .col-full {
    grid-column: span 1 !important;
  }

  .case-meta {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* --- MOBILE (<= 767px) --- */
@media (max-width: 767px) {
  .case-study-hero {
    padding-top: var(--space-3);
    padding-bottom: var(--space-6);
  }

  .case-title {
    font-size: clamp(30px, 9vw, 42px);
    line-height: 1.02;
    margin-bottom: var(--space-3);
  }

  .case-subtitle {
    font-size: 16px;
    line-height: 1.45;
    margin-bottom: var(--space-6);
  }

  .case-meta {
    grid-template-columns: 1fr;
    gap: var(--space-3);
    padding: var(--space-4) 0;
    margin-bottom: var(--space-6);
  }

  .case-tldr-card {
    padding: var(--space-4) var(--space-5);
    margin-bottom: var(--space-8);
  }

  .tldr-grid {
    grid-template-columns: 1fr;
    gap: var(--space-3);
  }

  .chapter-title {
    font-size: 22px;
  }

  .prose-text {
    font-size: 15.5px;
    line-height: 1.6;
  }

  .editorial-callout {
    padding: var(--space-4);
    margin-top: var(--space-4);
    margin-bottom: var(--space-6);
  }

  .callout-quote {
    font-size: 15.5px;
  }

  .next-project-block {
    margin-top: var(--space-12);
    padding-top: var(--space-8);
    padding-bottom: var(--space-8);
  }

  .next-title-link {
    font-size: clamp(26px, 8vw, 40px);
  }
}