/* Only the visual-design view. The shared header and other portfolio pages stay untouched. */
body:has(.visual-studies.is-active) > footer { display: none; }
.visual-studies {
  --study-ink: #292b2e;
  --study-muted: #777a80;
  --study-rule: #e2e2e0;
  width: min(1200px, calc(100% - 96px));
  margin: 0 auto;
  padding: 68px 0 32px;
  color: var(--study-ink);
}
.visual-studies h1, .visual-studies h2, .visual-studies p, .visual-studies figure { margin: 0; }
.studies-eyebrow, .studies-index, .study-caption, .studies-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  font-size: 11px;
  line-height: 1.7;
  color: var(--study-muted);
}
.studies-eyebrow > :first-child { color: var(--red); font-weight: 500; letter-spacing: .12em; }
.studies-intro-row { display: flex; justify-content: space-between; align-items: end; gap: 40px; margin: 26px 0 34px; }
.studies-intro-row h1 { font-size: clamp(28px, 3.1vw, 42px); line-height: 1.35; font-weight: 500; letter-spacing: -.04em; }
.studies-intro-row p { color: #74777c; font-size: 13px; line-height: 1.9; }
.studies-index { border-top: 1px solid var(--study-rule); padding-top: 15px; }
.studies-index b { margin-left: 12px; font-size: 12px; color: var(--study-ink); font-weight: 500; }
.study-editorial { display: grid; grid-template-columns: 225px minmax(0, 1fr); gap: 48px; margin-top: 52px; }
.study-description { display: flex; flex-direction: column; align-items: start; padding-top: 8px; }
.study-number { display: flex; align-items: center; gap: 14px; color: var(--red); font-size: 13px; line-height: 1; font-variant-numeric: tabular-nums; }
.study-number i { display: block; width: 26px; height: 1px; background: #c9c9c6; }
.study-category { margin-top: 32px !important; color: var(--study-muted); font-size: 11px; letter-spacing: .06em; }
.visual-studies h2 { margin-top: 10px; font-size: 38px; font-weight: 500; line-height: 1.1; letter-spacing: -.045em; }
.study-subtitle { margin-top: 17px !important; font-size: 15px; line-height: 1.7; }
.study-copy { font-size: 13px; line-height: 1.95; color: #7a7c81; }
.study-description .study-copy { margin-top: 24px; max-width: 214px; }
.study-tags { display: flex; flex-wrap: wrap; gap: 8px 12px; padding: 0; margin: 23px 0 0; list-style: none; color: #66696e; font-size: 10px; }
.study-tags li + li { border-left: 1px solid #d4d5d7; padding-left: 12px; }
.study-format { margin-top: auto; padding: 70px 0 36px; font-size: 11px; line-height: 1.9; }
.study-format > span { color: #989a9e; }
.study-format p { margin-top: 5px; color: #66696e; }
.study-figure { min-width: 0; }
.study-stage { position: relative; overflow: hidden; isolation: isolate; }
.editorial-stage { display: grid; place-items: center; aspect-ratio: 1.25; background: #efeeea; padding: 6.5%; }
.stage-corner { position: absolute; right: 18px; bottom: 12px; font-size: 9px; color: #999b9e; letter-spacing: .06em; }
.editorial-placeholder { position: relative; width: 85%; aspect-ratio: 1216 / 1060; padding: 5%; background: #fafaf8; border: 1px solid #e5e4df; }
.placeholder-masthead { display: flex; align-items: center; justify-content: space-between; padding-bottom: 12%; }
.placeholder-masthead > :first-child { color: #81857f; font-size: clamp(20px, 2.8vw, 38px); font-weight: 400; letter-spacing: -.06em; }
.placeholder-masthead > :last-child { font-size: 9px; color: #acafa8; }
.placeholder-columns { display: grid; grid-template-columns: 1fr 1.2fr; gap: 12%; margin-bottom: 10%; }
.placeholder-title-lines, .placeholder-copy-lines { display: flex; flex-direction: column; gap: 10px; }
.placeholder-title-lines i { width: 100%; height: 15px; background: #dfe1da; }
.placeholder-title-lines i:last-child { width: 68%; }
.placeholder-copy-lines i { height: 4px; background: #e3e5df; }
.placeholder-copy-lines i:last-child { width: 63%; }
.placeholder-rule-row { display: grid; grid-template-columns: 20px 1fr 1.2fr; align-items: start; gap: 8%; border-top: 1px solid #dedfd9; padding: 4% 0 6%; }
.placeholder-rule-row span { font-size: 11px; color: #9da397; }
.placeholder-rule-row i { height: 9px; margin-top: 4px; background: #e4e6df; }
.placeholder-rule-row i:last-child { height: 4px; background: #e9eae5; }
.placeholder-paper-note { position: absolute; bottom: 5%; left: 5%; color: #a0a39b; font-size: 10px; }
.study-caption { padding-top: 14px; font-size: 10px; }
.study-product { margin-top: 92px; padding-top: 35px; border-top: 1px solid var(--study-rule); }
.study-product-heading { display: grid; grid-template-columns: 68px 1fr 340px; gap: 30px; align-items: start; margin-bottom: 30px; }
.study-product-heading .study-number { padding-top: 4px; }
.study-product-heading .study-category { margin-top: 0 !important; }
.study-product-description { padding-top: 10px; }
.study-product-description .study-tags { margin-top: 16px; }
.product-stage { display: grid; place-items: center; aspect-ratio: 16 / 9; background: #eef0f4; }
.orbit-placeholder { position: relative; width: 84%; height: 84%; }
.orbit-placeholder-title { display: flex; align-items: baseline; justify-content: center; gap: 16px; height: 28%; padding-top: 2%; color: #878c98; font-size: clamp(24px, 3vw, 40px); font-weight: 500; letter-spacing: -.055em; }
.orbit-placeholder-title span { font-size: 11px; font-weight: 400; letter-spacing: 0; color: #9da2ad; }
.orbit-placeholder-window { position: absolute; width: 78%; height: 66%; left: 11%; top: 29%; background: #fafbfc; border: 1px solid #dce0e6; border-radius: 8px; overflow: hidden; }
.placeholder-window-bar { display: flex; align-items: center; gap: 5px; height: 22px; padding-left: 10px; border-bottom: 1px solid #e6e8ed; background: #f5f6f8; }
.placeholder-window-bar i { width: 4px; height: 4px; border-radius: 50%; background: #d5d8df; }
.placeholder-workspace { display: grid; grid-template-columns: 20% 1fr; height: calc(100% - 22px); }
.placeholder-workspace > :first-child { background: #f2f4f7; border-right: 1px solid #e7e9ed; }
.placeholder-workspace > :last-child { display: flex; flex-direction: column; gap: 16%; padding: 8%; }
.placeholder-workspace i { display: block; height: 3px; background: #e8ebef; }
.placeholder-workspace i:first-child { width: 35%; height: 9px; background: #dee2e8; }
.placeholder-side { position: absolute; width: 21%; padding: 18px; border: 1px solid #dce0e6; border-radius: 6px; background: #f9fafc; }
.placeholder-side i { display: block; height: 3px; margin-bottom: 13px; background: #e2e6ec; }
.placeholder-side-left { left: 0; top: 57%; height: 32%; background: #d9dce2; border-color: #d1d5dc; }
.placeholder-side-left i { background: #c3c8d1; }
.placeholder-side-right { right: 0; top: 37%; height: 43%; }
.study-playback-note { display: grid; grid-template-columns: 1fr 2fr; gap: 30px; padding: 30px 0 0; font-size: 11px; line-height: 1.9; color: #868a91; }
.study-playback-note p { max-width: 540px; }
.studies-footer { border-top: 1px solid var(--study-rule); margin-top: 72px; padding-top: 20px; font-size: 10px; }
@media (min-width: 1600px) { .visual-studies { width: min(1360px, calc(100% - 160px)); } }
@media (max-width: 1000px) {
  .visual-studies { width: calc(100% - 56px); padding-top: 44px; }
  .studies-intro-row { align-items: start; flex-direction: column; gap: 18px; }
  .study-editorial { grid-template-columns: 185px minmax(0, 1fr); gap: 28px; }
  .study-product-heading { grid-template-columns: 46px 1fr 260px; gap: 20px; }
  .study-number { gap: 8px; }
  .study-number i { width: 18px; }
}
@media (max-width: 650px) {
  .visual-studies { width: calc(100% - 36px); padding-top: 32px; }
  .studies-intro-row { margin-top: 20px; }
  .studies-intro-row h1 { font-size: 27px; }
  .studies-index { font-size: 10px; gap: 12px; }
  .study-editorial { grid-template-columns: 1fr; gap: 24px; margin-top: 34px; }
  .study-category { margin-top: 22px !important; }
  .study-description .study-copy { max-width: 100%; margin-top: 14px; }
  .study-format { padding: 20px 0 0; display: flex; gap: 18px; }
  .study-format p { margin-top: 0; }
  .study-tags { margin-top: 16px; }
  .study-caption { gap: 8px; font-size: 9px; }
  .placeholder-title-lines, .placeholder-copy-lines { gap: 6px; }
  .placeholder-title-lines i { height: 8px; }
  .placeholder-copy-lines i { height: 3px; }
  .placeholder-paper-note { font-size: 8px; }
  .study-product { margin-top: 48px; padding-top: 26px; }
  .study-product-heading { grid-template-columns: 36px 1fr; gap: 18px; }
  .study-product-description { grid-column: 2; padding-top: 0; }
  .product-stage { aspect-ratio: 4 / 3; }
  .orbit-placeholder { width: 92%; height: 80%; }
  .orbit-placeholder-title { gap: 10px; }
  .orbit-placeholder-title span { font-size: 9px; }
  .placeholder-side { padding: 10px; }
  .placeholder-window-bar { height: 16px; }
  .placeholder-workspace { height: calc(100% - 16px); }
  .study-playback-note { grid-template-columns: 1fr; gap: 6px; padding-top: 22px; }
  .studies-footer { margin-top: 42px; align-items: start; flex-direction: column; gap: 6px; }
}
