/* Interactive prototypes share the portfolio's type, surfaces and spacing. */
.case-prototype { background:#fff; padding:clamp(56px,6vw,88px) clamp(20px,5vw,64px); }
.case-prototype__inner { width:100%; max-width:1192px; margin:0 auto; display:flex; flex-direction:column; align-items:center; gap:40px; }
.case-prototype__copy { width:100%; max-width:760px; text-align:center; }
.case-prototype__copy h2 { margin:0 0 20px; color:#111; }
.case-prototype__copy p { margin:0; font-size:17px; line-height:1.65; color:#4d5b70; }
.case-prototype__viewer { width:100%; max-width:420px; height:auto; aspect-ratio:390 / 844; overflow:hidden; background:#fff; border:0; box-shadow:none; }
.case-prototype__viewer iframe { display:block; width:100%; height:100%; border:0; }
.case-prototype--desktop .case-prototype__inner { display:flex; flex-direction:column; gap:40px; }
.case-prototype--desktop .case-prototype__copy { max-width:760px; text-align:center; }
.case-prototype--desktop .case-prototype__copy h2 { margin-bottom:20px; }
.case-prototype--desktop .case-prototype__viewer { max-width:none; aspect-ratio:1440 / 1024; }
@media (max-width:767px) {
  .case-prototype { padding-top:48px; padding-bottom:48px; }
  .case-prototype__inner { gap:28px; }
  .case-prototype__copy { max-width:520px; text-align:left; }
  .case-prototype__copy h2 { margin-bottom:18px; }
  .case-prototype__copy p { font-size:16px; }
  .case-prototype__viewer { max-width:390px; }
  .case-prototype--desktop .case-prototype__inner { gap:28px; }
  .case-prototype--desktop .case-prototype__copy { text-align:left; }
  .case-prototype--desktop .case-prototype__viewer { aspect-ratio:1440 / 1024; }
}