/* Responsive translation of the approved desktop composition. */

@media (max-width: 1120px) {
  body { min-width: 0; overflow-x: clip; }
  .site-header__inner,
  body[data-hero-study="field-to-record-refined"] .hero-clarity__copy,
  body[data-hero-study="field-to-record-refined"] .hero-clarity__record {
    width: calc(100% - 48px);
  }
  .site-header__inner { grid-template-columns: 150px 1fr auto; gap: 22px; }
  .primary-nav { gap: 24px; }
  .opening-unit { width: calc(100% - 48px); }
  body[data-active-variant="c"] .handoff-strip { grid-template-columns: 1fr 0.8fr 2.8fr auto; }
  .pitch-variant--state,
  .photo-change,
  .process-variant,
  .credibility-variant,
  .route-close,
  .site-footer { min-width: 0; }
}

@media (max-width: 720px) {
  html { scroll-padding-top: 104px; }
  body { min-width: 0 !important; width: 100%; overflow-x: clip; font-size: 14px; }
  img { max-width: 100%; }

  .site-header { height: 104px; }
  .site-header__inner {
    width: 100%;
    padding: 0 16px;
    grid-template-columns: 1fr auto;
    grid-template-rows: 48px 56px;
    gap: 0 14px;
  }
  .wordmark { grid-column: 1; grid-row: 1; font-size: 27px; }
  .route-action--header { grid-column: 2; grid-row: 1; min-height: 36px; padding: 0 13px; gap: 10px; font-size: 11px; }
  .primary-nav {
    grid-column: 1 / -1;
    grid-row: 2;
    width: calc(100% + 32px);
    margin-left: -16px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    border-top: 1px solid #cfd7d4;
  }
  .primary-nav a {
    min-height: 56px;
    padding: 0 4px;
    display: grid;
    place-items: center;
    border-left: 1px solid #dce4e1;
    font-size: 10px;
    text-align: center;
  }

  body[data-hero-study="field-to-record-refined"] .field-opening { min-height: 0 !important; }
  body[data-hero-study="field-to-record-refined"] .hero-clarity {
    min-height: 0 !important;
    display: block !important;
  }
  body[data-hero-study="field-to-record-refined"] .hero-clarity__media { height: 360px !important; }
  body[data-hero-study="field-to-record-refined"] .hero-clarity__media img { object-position: 58% 54% !important; }
  body[data-hero-study="field-to-record-refined"] .hero-clarity__copy {
    width: 100% !important;
    padding: 28px 18px 34px !important;
    display: block !important;
  }
  body[data-hero-study="field-to-record-refined"] .hero-clarity__eyebrow { margin-bottom: 12px; }
  body[data-hero-study="field-to-record-refined"] .hero-clarity h1 {
    max-width: 8ch !important;
    font-size: clamp(44px, 13vw, 54px) !important;
    line-height: .92 !important;
  }
  body[data-hero-study="field-to-record-refined"] .hero-clarity__summary {
    margin: 24px 0 0;
    padding: 0;
    font-size: 16px;
  }
  body[data-hero-study="field-to-record-refined"] .hero-clarity__action { margin-top: 20px; }
  body[data-hero-study="field-to-record-refined"] .hero-clarity__record {
    width: calc(100% - 28px) !important;
    min-height: 0 !important;
    position: relative !important;
    left: auto !important;
    bottom: auto !important;
    margin: 0 14px 30px !important;
    display: block !important;
    transform: none !important;
  }
  body[data-hero-study="field-to-record-refined"] .hero-clarity__record-label { padding: 14px 0; }
  body[data-hero-study="field-to-record-refined"] .hero-clarity__record dl { display: block !important; }
  body[data-hero-study="field-to-record-refined"] .hero-clarity__fact {
    min-height: 72px;
    padding: 15px 16px !important;
    border-top: 1px solid var(--hero-rule);
    border-left: 0 !important;
  }
  body[data-hero-study="field-to-record-refined"] .hero-clarity__fact--blocking { border-left: 4px solid var(--hero-blocked) !important; }

  .pitch-study { min-height: 0 !important; padding: 72px 16px 76px !important; }
  .pitch-variant--state { width: 100% !important; }
  .pitch-intro--state { display: block !important; }
  .pitch-intro--state h2 { max-width: 9ch; font-size: 43px !important; line-height: .95 !important; }
  .pitch-intro--state > p:last-child { max-width: 32ch; margin: 22px 0 0 !important; font-size: 16px !important; }
  .working-state { margin-top: 42px; }
  .working-state__head { min-height: 0; grid-template-columns: 1fr 1fr; }
  .working-state__head > div { min-height: 78px; padding: 16px; }
  .working-state__head > div:nth-child(2) { border-left: 1px solid #b7c1be; }
  .working-state__status { grid-column: 1 / -1; min-height: 58px; padding: 14px 16px; }
  .working-state__question { min-height: 0; padding: 24px 16px; display: block; }
  .working-state__question > strong { display: block; margin-top: 13px; font-size: 28px; }
  .working-state__facts { display: block; }
  .working-state__fact { min-height: 0; padding: 23px 16px; border-left: 0 !important; border-top: 1px solid #b7c1be; }
  .working-state__answer { min-height: 0; padding: 22px 16px; display: block; }
  .working-state__answer > strong { display: block; margin: 12px 0 20px; font-size: 31px; }

  .photo-change-study { min-height: 0 !important; padding: 72px 0 0 !important; }
  .photo-change--hinge { min-height: 0 !important; display: flex !important; flex-direction: column; }
  .photo-hinge__copy,
  .photo-hinge__statement,
  .photo-hinge__closing { width: auto !important; margin: 0 18px; padding: 0 !important; }
  .photo-hinge__copy h2 { font-size: 43px !important; line-height: .94 !important; }
  .photo-hinge__figure { position: relative !important; inset: auto !important; width: 100% !important; height: 430px !important; margin: 36px 0 30px !important; }
  .photo-hinge__figure img { height: 100%; object-fit: cover; object-position: 48% 50%; }
  .photo-hinge__statement strong { font-size: 32px !important; }
  .photo-hinge__closing { margin-top: 28px; padding-bottom: 72px !important; }

  .process-study { padding: 0 !important; }
  .process-study .theatre,
  .theatre-track { min-height: 0 !important; height: auto !important; }
  .theatre-scene { min-height: 0 !important; padding: 70px 16px 76px !important; display: block !important; }
  .theatre-heading { display: block !important; }
  .theatre-heading h2 { max-width: 10ch; margin: 12px 0 18px; font-size: 42px !important; line-height: .94 !important; }
  .custody-field { width: 100% !important; margin: 40px 0 0 !important; display: block !important; }
  .custody-field figure { height: 330px !important; }
  .custody-question { padding: 22px 18px !important; }
  .custody-question strong { font-size: 26px !important; }
  .custody-boundary { display: none !important; }
  .custody-record { width: 100% !important; margin: 24px 0 0 !important; position: relative !important; inset: auto !important; }
  .custody-record header,
  .custody-evidence,
  .custody-record aside { grid-template-columns: 62px 1fr !important; gap: 10px !important; padding: 15px !important; }
  .custody-evidence em { grid-column: 2; text-align: left !important; }
  .custody-record aside strong { grid-column: 2; }
  .custody-approval { width: 100% !important; margin: 0 !important; position: relative !important; inset: auto !important; display: grid !important; grid-template-columns: 1fr 1fr 1fr !important; }
  .custody-approval p { grid-column: 1 / -1; }
  .custody-answer { width: 100% !important; min-height: 86px !important; position: relative !important; inset: auto !important; margin: 0 !important; padding: 22px 16px !important; font-size: 29px !important; }
  .theatre-stage-note { position: relative !important; inset: auto !important; margin-top: 18px; }
  .theatre-state-summary { display: block !important; padding: 0 16px 70px !important; }
  .theatre-state-summary li { min-height: 0; padding: 18px 0; }

  body[data-active-credibility="d"][data-credibility-style="documentary-field"] .credibility-continuation {
    min-height: 0 !important;
    display: block !important;
  }
  body[data-active-credibility="d"] .continuation-heading { padding: 70px 18px 38px !important; display: block !important; }
  body[data-active-credibility="d"] .continuation-heading h2 { max-width: 10ch !important; margin-top: 14px !important; font-size: 42px !important; }
  body[data-active-credibility="d"] .continuation-threshold-context { margin-top: 24px; }
  body[data-active-credibility="d"] .continuation-sequence {
    width: calc(100% - 28px) !important;
    height: auto !important;
    margin: 0 14px !important;
    display: block !important;
  }
  body[data-active-credibility="d"] .continuation-stage { min-height: 200px; padding: 24px 18px !important; border-bottom: 1px solid #dce4e1; }
  body[data-active-credibility="d"] .continuation-connector { width: 100% !important; height: 28px !important; }
  body[data-active-credibility="d"] .continuation-connector i { left: 18px !important; right: 18px !important; top: 13px !important; width: auto !important; height: 2px !important; }
  body[data-active-credibility="d"] .continuation-boundary { display: none !important; }
  body[data-active-credibility="d"] .continuation-stage--human { min-height: 220px; }
  body[data-active-credibility="d"] .continuation-human-copy { padding: 24px 18px !important; }
  body[data-active-credibility="d"][data-credibility-style="documentary-field"] .continuation-documentary-field {
    min-height: 0 !important;
    display: block !important;
    padding-top: 68px;
  }
  .documentary-field__copy { min-height: 390px; padding: 34px 18px !important; }
  .documentary-field__copy > strong { font-size: 38px !important; }
  .documentary-field__image { transform: none !important; }
  .continuation-documentary-field figure { height: 500px; }
  .continuation-documentary-field figcaption { grid-template-columns: 1fr; }
  .continuation-documentary-field figcaption span { text-align: left; }

  .route-close { min-height: 0; padding: 68px 18px; display: block; }
  .route-close h2 { max-width: 11ch; font-size: 42px; }
  .route-close__actions { margin-top: 34px; align-items: flex-start; }
  .opening-action,
  .text-action,
  .site-footer nav a { min-height: 44px; display: flex; align-items: center; }
  .site-footer { min-height: 0; padding: 46px 18px; display: block; }
  .site-footer nav { margin-top: 34px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px 12px; }
  .site-footer__disclosure { margin-top: 34px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
