/* L'Atelier Joaillerie Concept — styles communs.
   Les styles propres à chaque page sont dans le <style> de la page et en ligne sur les éléments
   (repris à l'identique de la maquette). Ce fichier ne contient que ce qui remplace le moteur
   de maquette : conteneurs photo, focus clavier, utilitaires partagés. */

html, body { height: 100%; margin: 0; }

/* Conteneur photo (ex-composant <image-slot>) : remplit son parent, photo recadrée au centre.
   Même structure et mêmes règles que le composant d'origine ; js/site.js ajuste ensuite la
   taille de l'image comme lui (cover / contain selon l'attribut fit). */
image-slot { display: block; position: relative; width: 100%; height: 100%; aspect-ratio: 3 / 2; }
image-slot > .frame { position: absolute; inset: 0; overflow: hidden; background: rgba(0, 0, 0, .04); }
image-slot > .frame > img { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; max-width: none; transform: translate(-50%, -50%); object-fit: cover; display: block; user-select: none; -webkit-user-drag: none; touch-action: none; }
image-slot[fit="contain"] > .frame > img { object-fit: contain; }

/* Bouton type 2 : lien souligné animé */
.u-wipe { position: relative; }
.u-wipe::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; opacity: .5; transform: scaleX(1); transform-origin: right; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.u-wipe:hover::after { transform: scaleX(0); }

/* Accessibilité : focus visible au clavier uniquement */
:focus-visible { outline: 2px solid #a8874f; outline-offset: 2px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
[hidden] { display: none !important; }