/* Thai Botanic film1 (11 Nov 2026): full-width silent film loop in "Inside the growing landscape." */
.photo-journal{overflow-x:clip}
.journal-film{position:relative;width:100vw;margin:0 0 30px calc(50% - 50vw);background:#1b1d16}
.journal-film video{display:block;width:100%;height:auto;aspect-ratio:21/9;max-height:78vh;object-fit:cover;background:#1b1d16}
.journal-film figcaption{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:14px max(20px,calc((100vw - var(--max,1180px))/2)) 15px;
  background:#fff;border-bottom:1px solid var(--line,#d8d1c3);font-size:15px;line-height:1.45}
.journal-film figcaption span{flex:none;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#7a7468}
.film-toggle{position:absolute;right:max(20px,calc((100vw - var(--max,1180px))/2));bottom:70px;width:40px;height:40px;border-radius:50%;
  border:1px solid rgba(255,255,255,.6);background:rgba(23,23,20,.45);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0}
.film-toggle:hover{background:rgba(23,23,20,.7)} .film-toggle:focus-visible{outline:3px solid #db5f2d;outline-offset:2px}
.film-toggle[hidden]{display:none} .film-toggle svg{width:16px;height:16px;fill:currentColor}
.film-toggle .i-play{display:none} .film-toggle[aria-pressed="true"] .i-pause{display:none} .film-toggle[aria-pressed="true"] .i-play{display:block}
@media (max-width:700px){.journal-film video{aspect-ratio:16/9}.journal-film figcaption{flex-direction:column;gap:4px;padding-inline:14px}.film-toggle{right:14px;bottom:auto;top:calc(56.25vw - 54px)}}
