/* Parts, products, factory: one Connections study. */
#design-studies {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(0, 1fr);
  column-gap: 64px;
  align-items: start;
  --studies-ink: #171717;
  --studies-secondary: #525252;
  --studies-muted: #6b6b6b;
  --studies-line: #e5e5e5;
}
#design-studies .studies-intro { grid-column: 2; grid-row: 1; margin-bottom: 0; }
#design-studies .study-spread { grid-column: 1; grid-row: 1; display: block; min-width: 0; }
#design-studies .lamp-study { padding: 0; }
#design-studies .lamp-stage { height: 420px; }
#design-studies > .study-note { grid-column: 1; }
#design-studies h2 {
  font-size: 48px;
  line-height: 56px;
  font-weight: 500;
  letter-spacing: -.02em;
  color: var(--studies-ink);
}
#design-studies .section-description { font-size: 18px; line-height: 28px; color: var(--studies-secondary); }
#design-studies .object-stage {
  background-image: linear-gradient(rgb(255 255 255 / .36), rgb(255 255 255 / .36)), url('/assets/silent/sea-glass-field.png');
  background-position: center;
  background-size: cover;
  border-radius: 12px;
}
#design-studies .factory-direction {
  grid-column: 1 / -1;
  margin-top: 64px;
  padding-top: 32px;
  border-top: 1px solid var(--studies-line);
}
#design-studies .factory-intro h3 { max-width: 380px; font-size: 32px; line-height: 40px; font-weight: 500; letter-spacing: -.02em; color: var(--studies-ink); text-wrap: balance; }
#design-studies .factory-copy > p { max-width: 600px; margin-top: 16px; font-size: 18px; line-height: 28px; color: var(--studies-secondary); text-wrap: pretty; }
#design-studies .factory-copy .text-link { margin-top: 16px; min-height: 44px; font-size: 14px; line-height: 20px; color: var(--studies-ink); }
html[lang=zh-CN] #design-studies h2,
html[lang=zh-CN] #design-studies .factory-intro h3 { letter-spacing: normal; line-height: 1.2; }
:root[data-theme=dark] #design-studies {
  --studies-ink: var(--text);
  --studies-secondary: var(--muted);
  --studies-muted: var(--muted);
  --studies-line: var(--line);
}
:root[data-theme=dark] #design-studies .object-stage { background-image: none; }
@media (max-width: 1050px) {
  #design-studies { column-gap: 40px; }
  #design-studies .lamp-stage { height: 350px; }
}
@media (max-width: 760px) {
  #design-studies { display: block; }
  #design-studies .studies-intro { margin-bottom: 28px; }
  #design-studies .lamp-stage { height: clamp(280px, 76vw, 355px); }
  #design-studies h2 { font-size: 36px; line-height: 44px; }
  #design-studies .section-description { font-size: 16px; line-height: 26px; }
  #design-studies .factory-direction { margin-top: 48px; padding-top: 24px; }
  #design-studies .factory-intro h3 { font-size: 28px; line-height: 36px; max-width: 340px; }
  #design-studies .factory-copy > p { font-size: 16px; line-height: 26px; }
}