/* =====================================================================
   Écran des bijoux — public/assets/bijoux.css

   Chargé par page.php en plus de screens.css et or.css, pour le seul
   écran des bijoux. Le cadre et la grille sont dans or.css, le footer
   dans footer.css.

   Un mur de photos : une image à la fois, plein cadre. La grille des
   catégories et le vrac ont été retirés — une grande photo dit ce que
   six cases énuméraient.

   Tout est porté par .or--bijoux. En playlist, les feuilles des deux
   écrans cohabitent dans le même document : une surcharge nue du cadre
   commun atteindrait aussi la grille des pièces. Le défaut ne se
   verrait jamais sur /bijoux servi seul — seulement une fois les deux
   enchaînés, donc tard et loin d'ici.
   ===================================================================== */


/* --- Plein cadre ----------------------------------------------------
   Le main perd sa marge sur cet écran : une photo de vitrine se
   regarde d'un bord à l'autre, et un liseré de navy autour d'elle la
   ferait ressembler à une image posée dans une page.

   Header et footer gardent la leur : ils encadrent, ils ne saignent
   pas.
   -------------------------------------------------------------------- */

.or--bijoux .or-main {
    padding: 0;
}


/* --- Le fondu -------------------------------------------------------
   Deux secondes, contre .8 pour un changement de grille. Une image qui
   se substitue vite à une autre se lit comme un défaut d'affichage ;
   lentement, comme une respiration — et c'est ce qu'on attend d'une
   vitrine de bijouterie.

   C'est le fondu de la bascule du main, ralenti pour cet écran : il
   n'y a qu'un moteur, une photo est une diapo comme une autre.
   -------------------------------------------------------------------- */

.or--bijoux .or-item {
    transition: opacity 2s ease;
}


/* --- La photo -------------------------------------------------------
   Un fond, et non une <img> : rien ne se pose dessus aujourd'hui, mais
   un fond se recadre sans qu'un enfant ait à sortir du flux. L'URL est
   une valeur, donc dans l'attribut style ; la règle est ici.

   Noir dessous : une image qui n'a pas encore chargé, ou qui n'existe
   pas sur le domaine, laisse un cadre neutre plutôt que le navy, qui
   se lirait comme un trou dans la mise en page.

   Cadrage attendu : environ 2400 x 1030, soit le rapport de la zone.
   Les images sont recadrées en cover — une photo carrée y perdrait la
   moitié de sa hauteur.
   -------------------------------------------------------------------- */

.or--bijoux .or-photo {
    position: absolute;
    inset: 0;
    background-color: #000;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}