.studies {
  --study-paper: #eeeae2;
  --study-gutter: clamp(24px, 4.4vw, 72px);
  padding: 56px var(--study-gutter) 0;
  background: var(--study-paper);
  color: #292721;
  color-scheme: light;
  scroll-margin-top: 30px;
}
.studies-heading { margin: 0 auto 36px; text-align: center; }
.studies-heading h2 { margin: 0 0 12px; font: 400 clamp(30px, 2.65vw, 40px)/1.15 var(--serif); letter-spacing: -.025em; }
.studies-heading p { margin: 0; color: #70695f; font: 400 16px/1.5 var(--sans); }
.studies-collage { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(70px, 6.3vw, 110px); max-width: 860px; margin: 0 auto; padding-bottom: 56px; border-bottom: 1px solid #29272130; }
.study-group { min-width: 0; scroll-margin-top: 100px; }
.study-woven { padding-top: clamp(90px, 8vw, 120px); }
.study-composition { position: relative; }
.study-frame { position: relative; transform: translate3d(0, var(--float-y, 0px), 0); }
.study-image { position: relative; display: block; color: inherit; cursor: zoom-in; text-decoration: none; }
.study-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.study-image:focus-visible { outline: 2px solid #584933; outline-offset: 6px; }
.study-wish .study-frame-1 .study-image { aspect-ratio: 1.18; }
.study-wish .study-frame-2 { width: 55%; margin: -50px 7% 0 auto; z-index: 1; }
.study-wish .study-frame-2 .study-image { aspect-ratio: 1; border: 3px solid var(--study-paper); }
.study-copy { margin-top: 22px; }
.study-copy h3 { margin: 0 0 10px; font: 400 clamp(25px, 1.8vw, 28px)/1.15 var(--serif); letter-spacing: -.02em; }
.study-description { max-width: 31ch; margin: 0; color: #70695f; font: 400 16px/1.45 var(--sans); }
.study-kind { margin: 12px 0 0; color: #70695f; font: 400 14px/1.4 var(--sans); }
.study-woven .study-frame-1 .study-image { aspect-ratio: 1.32; }
.study-woven .study-frame-1 img { object-position: 58% center; }
.study-woven .study-frame-2 { width: 44%; margin: -42px -9% 0 auto; z-index: 1; }
.study-woven .study-frame-2 .study-image { aspect-ratio: .9; border: 3px solid var(--study-paper); }
.study-woven .study-copy { width: 62%; margin-top: clamp(-135px, -8.7vw, -90px); padding-bottom: 24px; }
[data-reveal].reveal-pending { opacity: 0; transform: translate3d(0, 26px, 0); }
[data-reveal].reveal-ready { transition: opacity 900ms ease var(--reveal-delay, 0ms), transform 1100ms cubic-bezier(.2,.7,.2,1) var(--reveal-delay, 0ms); }
[data-reveal]:focus-within { opacity: 1; transform: none; }
@media (max-width: 1000px) and (min-width: 701px) {
  .studies-collage { gap: 52px; }
  .study-wish .study-frame-2 { margin-top: -24px; }
  .study-woven .study-frame-2 { margin-top: -20px; }
  .study-woven .study-copy { width: 100%; margin-top: 18px; padding-bottom: 0; }
}
@media (max-width: 700px) {
  .studies { padding-top: 52px; scroll-margin-top: 80px; }
  .studies-heading { max-width: 310px; margin-bottom: 44px; }
  .studies-heading h2 { font-size: 30px; }
  .studies-collage { display: block; max-width: 430px; padding-bottom: 58px; }
  .study-group + .study-group { margin-top: 86px; }
  .study-woven { padding-top: 0; }
  .study-wish .study-frame-2 { margin-top: -40px; }
  .study-woven .study-frame-2 { margin-right: 0; }
  .study-woven .study-copy { width: 53%; margin-top: -110px; padding-bottom: 0; }
  .study-copy h3 { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .study-frame, [data-reveal], [data-reveal].reveal-pending { opacity: 1 !important; transform: none !important; transition: none !important; }
}

.study-image { overflow: hidden; }
.study-image img { transition: transform 550ms cubic-bezier(.2,.7,.2,1); }
@media (hover:hover) and (pointer:fine) {
  .study-image:hover img { transform: scale(1.035); }
}
.study-image:focus-visible img { transform: scale(1.035); }
@media(prefers-reduced-motion:reduce) { .study-image img { transition:none; transform:none !important; } }