/* A szomszédos szakaszok térköze laptopon és mobilon is tömörebb. */
#szolgaltatasok{padding-bottom:clamp(32px,4vw,52px)}
#rolam{padding-top:clamp(32px,4vw,52px)}
/* Lágy, jobbra lefelé vetülő árnyék minden fotón. */
:root{--photo-shadow:16px 14px 22px -5px #35213f66;--photo-shadow-hover:20px 18px 27px -4px #35213f80}
.hero-photo>img,.portrait>img,.salon-photos img{box-shadow:var(--photo-shadow)}
@media(max-width:600px){:root{--photo-shadow:9px 9px 16px -4px #35213f66;--photo-shadow-hover:12px 12px 20px -4px #35213f80}}
/* A kép egészében emelkedik ki, a szomszédok helye nem változik. */
.gallery figure{overflow:visible;position:relative;min-width:0}
.gallery a{display:block;border-radius:6px;position:relative;box-shadow:var(--photo-shadow);transition:transform .32s ease,box-shadow .32s ease}
.gallery img{transition:filter .32s ease}
.gallery figcaption{min-height:3.8em;transition:color .2s ease}
.gallery figure:focus-within{z-index:2}
.gallery a:focus-visible{transform:scale(1);box-shadow:var(--photo-shadow-hover)}
.gallery figure:focus-within figcaption{font-weight:600;color:var(--color-brand-primary)}
@media(hover:hover) and (pointer:fine){
  .gallery a{transform:scale(.9)}
  .gallery figure:hover{z-index:2}
  .gallery figure:hover a,.gallery figure:focus-within a{transform:scale(1);box-shadow:var(--photo-shadow-hover)}
  .gallery figure:hover figcaption{font-weight:600;color:var(--color-brand-primary)}
}
@media(prefers-reduced-motion:reduce){.gallery a,.gallery img,.gallery figcaption{transition:none!important}}