/* Issue #39: legacy photo compositions and separate construction-photo gallery. */
.case-page { padding-block:40px 44px; }
.case-inner { box-sizing:border-box; width:min(1000px,calc(100% - 48px)); margin-inline:auto; }
.case-page-heading { text-align:center; padding-bottom:54px; }
.case-page-heading::before { content:""; display:block; width:138px; height:102px; margin:0 auto 4px; background:url('plum-heading.svg') center / contain no-repeat; }
.case-page-heading h1 { margin:0; color:#222; font:26px/1.6 var(--serif,serif); }
.case-content { color:#393831; font-size:15px; line-height:1.95; }
.case-shop { padding:44px 0 50px; background:#faf7e6; scroll-margin-top:20px; }
.case-shop-heading { margin:0 0 26px; color:#52653e; text-align:center; font:28px/1.65 var(--serif,serif); }
.case-lead { max-width:820px; margin:0 auto 32px; overflow-wrap:anywhere; }
.case-proposal { margin:32px 0 0; padding:32px 28px 40px; background:#fff; }
.case-pair { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); align-items:start; width:100%; max-width:820px; margin:0 auto 36px; }
.case-pair > .wp-block-group__inner-container,.case-gallery > .wp-block-group__inner-container { display:contents; }
.case-pair .case-shop-photo { box-sizing:border-box; min-width:0; margin:0; padding:6px; background:#fff; box-shadow:0 3px 10px rgb(57 56 49 / 22%); }
.case-shop-photo img { display:block; width:100%; height:auto; }
.case-pair .case-shop-photo:first-child { grid-column:1 / 7; grid-row:1; }
.case-pair .case-shop-photo:nth-child(2) { grid-column:4 / -1; grid-row:1; margin-top:45%; z-index:1; }
.case-pair-2 .case-shop-photo:first-child { grid-column:4 / -1; }
.case-pair-2 .case-shop-photo:nth-child(2) { grid-column:1 / 10; margin-top:55%; }
.case-pair-3 .case-shop-photo:nth-child(2) { max-width:445px; justify-self:end; }
.case-proposal h3 { margin:0 auto 24px; color:#71865c; font:700 28px/1.6 var(--serif,serif); text-align:center; text-wrap:balance; overflow-wrap:anywhere; }
.case-proposal p { max-width:760px; margin:0 auto; overflow-wrap:anywhere; }
.case-gallery-section { padding:44px 40px 0; scroll-margin-top:20px; }
.case-gallery-heading { margin:0 0 24px; padding:14px 18px; background:#e2e7dd; color:#52653e; text-align:center; font-size:20px; line-height:1.7; }
.case-gallery-intro { margin:0 0 32px; text-align:center; overflow-wrap:anywhere; }
.case-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:44px 40px; }
.case-photo { box-sizing:border-box; min-width:0; width:100%; max-width:460px; margin:0 auto; padding:8px; background:#fff; box-shadow:0 2px 8px rgb(57 56 49 / 18%); }
.case-photo img { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:contain; }
.case-photo figcaption { margin:0; padding:12px 4px 6px; color:#55594e; font:14px/1.8 var(--sans,sans-serif); overflow-wrap:anywhere; }
.case-back-top { margin-block:36px 0; text-align:center; }
.case-back-top a { display:inline-block; padding:12px; color:#52653e; text-decoration:underline; text-underline-offset:4px; }
.case-back-top a:focus-visible { outline:3px solid #49536f; outline-offset:3px; }
@media(max-width:1000px) and (min-width:701px) {
    .case-proposal { padding:26px 24px 34px; }
    .case-proposal h3 { font-size:25px; }
    .case-gallery-section { padding-inline:24px; }
    .case-gallery { gap:32px 24px; }
}
@media(max-width:700px) {
    .case-page { padding-block:28px 30px; }
    .case-inner { width:calc(100% - 16px); }
    .case-page-heading { padding-bottom:30px; }
    .case-page-heading::before { width:104px; height:78px; }
    .case-page-heading h1 { font-size:23px; }
    .case-shop { padding:30px 0 34px; }
    .case-shop-heading { font-size:23px; margin-bottom:22px; }
    .case-lead { margin-bottom:26px; }
    .case-proposal { padding:20px 10px 30px; margin-top:30px; }
    .case-pair { margin-bottom:32px; }
    .case-pair .case-shop-photo { padding:3px; }
    .case-proposal h3 { font-size:21px; }
    .case-gallery-section { padding:34px 0 0; }
    .case-gallery-heading { font-size:19px; padding:10px 12px; }
    .case-gallery { grid-template-columns:minmax(0,1fr); gap:32px; max-width:480px; margin-inline:auto; }
}