/* Rhema's real app leads this case study. */
body[data-theme="rhema"] .case-hero { min-height: 0; padding-top: clamp(48px, 5vw, 76px); padding-bottom: 56px; }
body[data-theme="rhema"] .case-hero h1 { font-size: clamp(58px, 8.2vw, 118px); margin-bottom: 42px; }
.rhema-app-feature { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.35fr); gap: clamp(34px, 4vw, 64px); align-items: center; padding: clamp(48px, 5vw, 76px) clamp(20px, 5vw, 78px); background: var(--navy); color: var(--paper); }
.rhema-app-copy { max-width: 460px; }
.rhema-app-copy h2 { font-family: var(--head); font-size: clamp(40px, 4.4vw, 64px); font-weight: 500; letter-spacing: -.055em; line-height: 1.04; margin: 25px 0; }
.rhema-app-copy h2 em { color: #d69b80; font-style: normal; }
.rhema-app-copy > p:not(.app-eyebrow) { color: #c8ced0; font-size: 17px; line-height: 1.8; }
.rhema-app-feature .app-gallery { width: 100%; max-width: 700px; gap: clamp(16px, 1.8vw, 26px); align-items: start; }
.rhema-app-feature .app-phone { display: block; max-width: 220px; border-color: #0b1218; border-width: 5px; border-radius: 25px; }
.rhema-app-feature a.app-phone:focus-visible { outline: 2px solid #d69b80; outline-offset: 5px; }
.rhema-app-feature .app-gallery figcaption { margin-top: 20px; }
.rhema-app-feature .app-gallery figcaption span { color: #c8ced0; }
.rhema-app-feature .app-case-link { margin-top: 20px; }
.rhema-app-feature .app-gallery-hint { grid-column: 1 / -1; margin: 0; }
@media (max-width: 1000px) {
  .rhema-app-feature { grid-template-columns: minmax(0, 1fr); gap: 38px; }
  .rhema-app-copy { max-width: 650px; }
  .rhema-app-feature .app-gallery { max-width: 740px; }
}
@media (max-width: 650px) {
  body[data-theme="rhema"] .case-hero { padding-bottom: 40px; }
  .rhema-app-feature { padding-block: 44px; gap: 28px; }
  .rhema-app-feature .app-gallery { gap: 22px; padding: 8px 5px 28px; scroll-padding-inline: 5px; }
  .rhema-app-feature .app-gallery figure { flex: 0 0 74%; max-width: 230px; }
}