/* Une grammaire photographique commune : douceur, respiration et cadrages utiles.
   Les images détaillant un équipement restent rectangulaires et lisibles. */
:root{--photo-soft:14px;--photo-curve:76px}

/* Les grandes vues gardent leur ampleur, avec une finition discrète. */
.hm-hero,.room-cover{border-radius:var(--photo-soft) var(--photo-soft) 42px 42px;overflow:hidden}
.st-private-hero,.pv-hero,.pv-return{border-radius:var(--photo-soft) var(--photo-soft) 42px 42px;overflow:hidden}

/* Des angles adoucis sur les photographies, jamais sur le logo ou les légendes. */
:is(.hm-bedroom-photo,.hm-destination>div,.st-room-cover,.st-room-detail,.st-room-house>figure,.st-house-scene>figure,.st-private-rooms figure,.st-private-finish>figure,.room-card .photo,.destination-card .photo,.pv-place-photo,.al-photo button,.rd-photo-grid button,.photo-grid button){border-radius:var(--photo-soft);overflow:hidden}
:where(.hm-portrait,.st-room-intro>figure,.al-intro>figure,.pv-local-photo)>img{border-radius:var(--photo-soft)}
.hm-inset{border-radius:18px;overflow:hidden;transform:rotate(1.5deg)}
.st-room-detail{transform:rotate(1.5deg)}
.booking-aside{border-radius:18px;overflow:hidden}
.booking-aside .aside-image{border-radius:18px 18px 0 0;overflow:hidden}

/* Une seule famille d'arches, réservée aux images d'atmosphère verticales. */
.hm-portrait>img{border-radius:48% 48% 14px 14px / 25% 25% 14px 14px}
.pv-wine-photo{border-radius:48% 48% 14px 14px / 20% 20% 14px 14px;overflow:hidden}

/* Quelques courbes plus généreuses ponctuent la visite sans encadrer chaque image. */
.hm-moment-photo{border-radius:14px var(--photo-curve) 14px 14px;overflow:hidden}
.hm-bedroom:nth-child(2) .hm-bedroom-photo{border-bottom-right-radius:var(--photo-curve)}
.hm-destination:nth-child(2)>div{border-bottom-left-radius:var(--photo-curve)}
.st-room-intro>figure>img,.al-intro>figure>img{border-top-right-radius:var(--photo-curve)}
.st-room-story:nth-of-type(even) .st-room-cover{border-bottom-left-radius:var(--photo-curve)}
.st-room-story:nth-of-type(odd) .st-room-cover{border-bottom-right-radius:var(--photo-curve)}
.st-room-house>figure,.st-private-finish>figure{border-bottom-right-radius:var(--photo-curve)}
.st-house-scene>figure{border-top-right-radius:var(--photo-curve)}
.st-private-rooms>a:nth-child(even) figure{border-bottom-right-radius:54px}
.pv-local-photo>img{border-top-left-radius:var(--photo-curve)}
.pv-place:nth-child(3n+2) .pv-place-photo{border-bottom-left-radius:var(--photo-curve)}
.al-outside .al-photo:nth-child(2) button{border-top-left-radius:var(--photo-curve)}
.al-outside .al-photo:nth-child(5) button{border-bottom-right-radius:var(--photo-curve)}
.al-inside .al-photo:nth-child(2) button{border-bottom-left-radius:var(--photo-curve)}

/* Paysage pour les extérieurs, portrait pour les dressings et salles de bain.
   Les hauteurs alternent aussi sur téléphone, où le décalage des colonnes disparaît. */
@media(min-width:801px){
 .hm-moment-photo{height:480px}
 .st-house-scene>figure{height:470px}
 .al-outside .al-photo:first-child button{height:400px}
 .al-outside .al-photo:nth-child(2) button{height:430px}
 .al-outside .al-photo:nth-child(4) button{height:365px}
 .pv-place:nth-child(3n+2) .pv-place-photo{height:390px}
}
@media(max-width:800px){:root{--photo-soft:12px;--photo-curve:52px}}
@media(max-width:560px){
 .hm-hero,.room-cover,.st-private-hero,.pv-hero,.pv-return{border-radius:12px 12px 28px 28px}
 .hm-bedroom:first-child .hm-bedroom-photo{height:auto;aspect-ratio:4/5}
 .hm-bedroom:nth-child(2) .hm-bedroom-photo{height:auto;aspect-ratio:1/1}
 .hm-bedroom:nth-child(3) .hm-bedroom-photo{height:auto;aspect-ratio:5/4}
 .hm-moment-photo{height:auto;aspect-ratio:4/3}
 .st-house-scene>figure{height:auto;aspect-ratio:4/3}
 .st-private-finish>figure{height:auto;aspect-ratio:5/4}
 .al-outside .al-photo:first-child button,.al-outside .al-photo:nth-child(4) button,.al-outside .al-photo:nth-child(5) button{height:auto;aspect-ratio:4/3}
 .al-outside .al-photo:nth-child(2) button,.al-outside .al-photo:nth-child(6) button{height:auto;aspect-ratio:4/5}
 .al-outside .al-photo:nth-child(3) button{height:auto;aspect-ratio:5/4}
 .al-room-grid .al-photo:first-child button{height:auto;aspect-ratio:4/3}
 .al-inside .al-photo:first-child button{height:auto;aspect-ratio:4/3}
 .pv-place:nth-child(3n+2) .pv-place-photo{height:auto;aspect-ratio:4/3}
}

/* Le cadre arrondi ne doit pas rogner l'indicateur de navigation au clavier. */
:is(.hm-bedroom-photo,.hm-inset,.al-photo button,.rd-photo-grid button):focus-visible{outline-offset:5px}