/* The original logo and photo captions occupy separate columns of the same photograph. */
body.folio-home {
  --home-edge:var(--pad);
  --home-logo-width:min(clamp(84px,calc(18vw + 46px),168px),36vh);
  --home-column-gap:24px;
}
body.folio-home header {padding:30px var(--home-edge)}
body.folio-home header .brand {width:var(--home-logo-width);max-width:none}
body.folio-home header .brand .brand-full {display:block;width:100%;height:auto;max-width:100%}
body.folio-home .atmosphere {width:100%;height:100vh;height:100dvh;min-height:0;max-height:none}
body.folio-home .atmosphere .atmosphere-slide > img {
  width:100%;height:100%;object-fit:cover;filter:none;
}
body.folio-home .slide-caption {
  top:116px;right:var(--home-edge);
  width:min(560px,calc(100% - 2 * var(--home-edge) - var(--home-logo-width) - var(--home-column-gap)));
  max-width:none;text-align:right;
}
body.folio-home .slide-caption .slide-project {overflow-wrap:anywhere}
@media(max-width:700px) {
  body.folio-home {
    --home-edge:clamp(16px,4vw,24px);
    --home-logo-width:clamp(72px,24vw,100px);
    --home-column-gap:clamp(16px,4vw,24px);
  }
  body.folio-home header {padding-top:22px}
  body.folio-home .slide-caption {top:96px}
}
/* Short landscape windows put the caption beside the logo, clear of the menu button. */
@media(max-height:420px) and (min-aspect-ratio:1/1) {
  body.folio-home {--home-logo-width:min(104px,28vh)}
  body.folio-home header {padding-top:22px}
  body.folio-home .slide-caption {
    top:22px;right:calc(var(--home-edge) + 72px);
    width:min(560px,calc(100% - 2 * var(--home-edge) - var(--home-logo-width) - var(--home-column-gap) - 72px));
  }
  body.folio-home .slide-caption .slide-project {margin-top:8px}
}