/* Timmerman — linked after ../../style.css, ../diensten.css and ../badkamer-renovatie/dienst.css (the badkamer page's
   frames, used as they stand). This file carries only what placing this page's own pictures needs: each frame's
   shape where its picture differs from the badkamer's. Every focus is the one in whatsapp/plaatsen/timmerman.md
   (recomputed where our copy is cut); ../../focus.js crops around it.
   2026-10-02 (template2-fotos): every place shows its picks, in the vloerverwarming page's form: the large picture,
   the thumbnails under it and the "+N" tile after the last one (../../style.css; ../../script.js fills the row);
   the ceiling keeps the badkamer page's slider with its two more pairs under it. A section stays one block. */

/* ==================================================== OPENING: n=81, cut to 1424×2048 (the hand with the phone off), its
   focus 0.01 0.05 0.97 0.78 stands whole between 0.67:1 and 0.89:1, so 4:5 at every width */
.intro__groot img { aspect-ratio: 4 / 5; }
.intro__groot { --groot-vorm: calc(4 / 5); }   /* the same shape as a number: the desktop fold's cap (../diensten.css) */

/* two thumbnail shapes this page adds to ../diensten.css: 3:5 for a 9:16 picture (n=466, its focus 0.85 of the
   height, which 3:4 cuts), 5:3 for a 16:9 one (n=180, its focus 0.85 of the width, which 4:3 cuts) */
.duim.duim--35 { width: 43px; height: 72px; }
.duim.duim--53 { width: 120px; height: 72px; }
@media (max-width: 560px) {
  .duim.duim--35 { width: 38px; height: 64px; }
  .duim.duim--53 { width: 105px; height: 63px; }
}

/* ==================================================== A PLACE: the large picture with its thumbnails under it */
.plek__groot { display: block; }
.plek__duimen { margin-top: 14px; align-items: flex-end; }
@media (max-width: 560px) {
  .plek__duimen { margin-top: 10px; }
}

/* ==================================================== 1 · AFTIMMEREN: the badkamer's zolder panel, its picture column
   holding n=116 at 107:100 (its focus, 0.12 0 0.82 0.86, stands whole from 0.76:1 to 1.08:1; this wide, the toilet at
   its foot stays out) with n=94 and the "+7" under it */
.s-aftimmeren .zolder { display: block; }
.s-aftimmeren .plek__groot { aspect-ratio: 107 / 100; }

/* ==================================================== 2 · ZOLDER BETIMMEREN: the toilet frame's heavy rule, one large
   picture where it has three: n=177 upright in a lying 8:7 (it shows 66% of the height; the focus, 0.08 0.12 0.88 0.5,
   the window and the knieschot), with n=136, 180 and the "+12" under it, beside the lead; on a phone above it. The
   closing move stands after the framed list, so that on a phone it still closes the section. */
@media (min-width: 861px) {
  .s-zolderbetimmeren .wc { grid-template-columns: minmax(0, 1fr) minmax(0, 360px); }
}
.s-zolderbetimmeren .wc__fotos { display: block; overflow: visible; margin-right: 0; padding-right: 0; }
.s-zolderbetimmeren .plek__groot { aspect-ratio: 8 / 7; }
.wc__sluit { grid-column: 1; }
@media (max-width: 860px) {
  .s-zolderbetimmeren .wc__fotos { max-width: 460px; }
}

/* ==================================================== 3 · PLAFOND VERNIEUWEN: the badkamer frame (7:8, 4:5 on a phone)
   holds the Almere pair (n=274 / 283), both cut to the same 1.11:1 and lined up; their focus, 0.3 0 0.7 0.95, stands
   whole from 0.78:1 to 1.16:1. Under it two more pairs (.paar, ../../style.css), the second with the "+11". */

/* ==================================================== 4 · TUSSENWAND PLAATSEN: the card's column of work: n=289 leads in
   the badkamer frame's 4:5 (its focus, 0 0.15 1 0.8, stands whole up to 0.94:1, so 4:5 also below 960 where the
   badkamer frame turns square), with n=129, 466 and the "+13" under it */
.s-tussenwand .kaart__fotos { grid-area: strook; min-width: 0; }
.s-tussenwand .strook { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 960px) {
  .s-tussenwand .kaart__fotos { max-width: 460px; }
  .s-tussenwand .strook .strook__lead .tegel { aspect-ratio: 4 / 5; }
}

/* ==================================================== 5 · NISSEN EN OMBOUW OP MAAT: the changed ground, the column that
   stays in view holds n=458 at 3:4 (its own shape) with n=437, 365, 68 and the "+13" under it. While it stays in view
   it has to fit the screen whole, thumbnails included, so on a low screen the picture narrows. */
.s-nissen .nis__fotos { position: sticky; top: 24px; align-self: start; }
.s-nissen .plek__groot { aspect-ratio: 3 / 4; width: min(100%, max(360px, calc((100vh - 170px) * 3 / 4))); }
@media (max-width: 960px) {
  .s-nissen .nis__fotos { position: static; max-width: 460px; }
  .s-nissen .plek__groot { width: 100%; }
}

