/* AAZ Galerie | Fiche produit, section GALERIE PRODUIT : vue 3D du cadre (dernière diapositive).
   Couleurs : palette Kadence (palette3 navy, palette8 blanc cassé, palette9 blanc, palette15 laiton). */
.aaz3d-slide { list-style: none; }
.aaz3d-stage {
	position: relative; width: 100%; aspect-ratio: var(--aaz3d-ratio, 5 / 7); overflow: hidden;
	background: var(--global-palette8, #f4f4f4); container-type: inline-size;
	-webkit-user-select: none; user-select: none;
}
.aaz3d-stage:fullscreen { aspect-ratio: auto !important; width: 100vw; height: 100vh; }

/* plein écran « maison » : calque fixe (mobile, ou navigateur sans plein écran) */
.aaz3d-overlay { position: fixed; inset: 0; z-index: 100000; display: none; height: 100vh; height: 100dvh; background: var(--global-palette8, #f4f4f4); }
.aaz3d-overlay.is-open { display: block; }
.aaz3d-stage.is-overlay { width: 100%; height: 100%; aspect-ratio: auto !important; }
html.aaz3d-lock, html.aaz3d-lock body { overflow: hidden; }
/* téléphone : la page reste figée à sa place sous la vue 3D (iPhone compris) et y revient à la sortie */
html.aaz3d-lock body { position: fixed; left: 0; right: 0; width: 100%; }
.aaz3d-stage.is-overlay .aaz3d-btn[data-act="fs"] { display: none; }
@media (max-width: 767px) { .aaz3d-btn[data-act="fs"] { display: none; } }

/* croix de fermeture, comme les modales des fiches produit : rouge, croix blanche ; au survol, gris clair, croix rouge */
.aaz3d-close {
	position: absolute; top: calc(12px + env(safe-area-inset-top, 0px)); right: 12px; z-index: 4;
	display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: .4rem; margin: 0;
	border: 0; border-radius: 10rem; background: var(--global-palette13, #e20606); color: var(--global-palette9, #fff);
	cursor: pointer; box-shadow: 0 2px 10px rgba(0, 10, 40, .15); min-height: 0; transition: background .2s, color .2s;
}
.aaz3d-close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.aaz3d-close:hover, .aaz3d-close:focus-visible { background: var(--global-palette8, #f4f4f4); color: var(--global-palette13, #e20606); outline: none; }
/* image figée pendant un changement de format (au-dessus de la galerie, le temps que tout se remette en place) */
.aaz3d-cover { z-index: 20; aspect-ratio: auto; pointer-events: none; transition: opacity .25s ease; }
.aaz3d-cover.is-fading { opacity: 0; }
.aaz3d-cover-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* barre de chargement (changement de format ou de cadre) */
.aaz3d-progress { position: absolute; left: 0; right: 0; top: 0; z-index: 5; height: 3px; opacity: 0; pointer-events: none; transition: opacity .3s; }
.aaz3d-progress span { display: block; width: 0; height: 100%; background: var(--global-palette3, #000a28); transition: width .25s ease; }
.aaz3d-stage.is-loading .aaz3d-progress { opacity: 1; }
.aaz3d-mv {
	position: absolute; inset: 0; width: 100%; height: 100%;
	--poster-color: transparent; --progress-bar-color: transparent;
	background: transparent; opacity: 0; transition: opacity .45s ease;
}
.aaz3d-stage.is-ready .aaz3d-mv { opacity: 1; }

/* attente */
.aaz3d-wait {
	position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
	color: var(--global-palette3, #000a28); font-size: 13px; letter-spacing: .04em; text-transform: uppercase; transition: opacity .3s;
}
.aaz3d-stage.is-ready .aaz3d-wait { opacity: 0; pointer-events: none; }
.aaz3d-spin {
	width: 26px; height: 26px; border-radius: 50%; border: 2px solid rgba(0, 10, 40, .15);
	border-top-color: var(--global-palette3, #000a28); animation: aaz3d-spin 1s linear infinite;
}
.aaz3d-stage.is-ready .aaz3d-spin, .aaz3d-stage.is-error .aaz3d-spin { animation: none; }
.aaz3d-stage.is-error .aaz3d-wait-lbl::after { content: " indisponible"; }
/* connexion lente : pourcentage, puis « Connexion lente » et « Réessayer » */
.aaz3d-wait-info { min-height: 1.3em; margin-top: -4px; font-size: 12px; letter-spacing: .02em; text-transform: none; color: var(--global-palette5, #4a5568); font-variant-numeric: tabular-nums; }
.aaz3d-retry {
	display: none; align-items: center; min-height: 36px; padding: 0 16px; border-radius: 999px; cursor: pointer;
	border: 1px solid rgba(0, 10, 40, .18); background: #fff; color: var(--global-palette3, #000a28);
	font-family: inherit; font-size: 13px; font-weight: 600; line-height: 1; letter-spacing: 0; text-transform: none;
}
.aaz3d-stage.is-stalled .aaz3d-retry, .aaz3d-stage.is-error .aaz3d-retry { display: inline-flex; }
.aaz3d-stage.is-stalled .aaz3d-wait { opacity: 1; pointer-events: auto; }
.aaz3d-stage.is-ready.is-stalled .aaz3d-wait { background: rgba(242, 242, 242, .85); }
@keyframes aaz3d-spin { to { transform: rotate(360deg); } }

/* barres de navigation (façon pilule) : points d'intérêt au-dessus, navigation en dessous */
.aaz3d-bars {
	position: absolute; left: 12px; right: 12px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 3;
	display: flex; flex-direction: column; align-items: center; gap: 12px;
	opacity: 0; transition: opacity .3s; pointer-events: none;
}
.aaz3d-stage.is-ready .aaz3d-bars { opacity: 1; }
.aaz3d-bar {
	display: flex; align-items: center; gap: 8px; padding: 5px 8px; max-width: 100%;
	background: var(--global-palette9, #fff); border-radius: 999px; box-shadow: 0 2px 14px rgba(0, 10, 40, .12);
	pointer-events: none;
}
.aaz3d-stage.is-ready .aaz3d-bar { pointer-events: auto; }
.aaz3d-btn {
	display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 10px; border: 0; border-radius: 999px;
	background: transparent; color: var(--global-palette3, #000a28); font: inherit; font-size: 14px; line-height: 1;
	white-space: nowrap; cursor: pointer; box-shadow: none; text-transform: none; letter-spacing: 0; min-height: 0;
}
.aaz3d-btn.aaz3d-icon { padding: 0 9px; }
.aaz3d-btn svg { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.aaz3d-btn:hover, .aaz3d-btn:focus-visible { background: var(--global-palette8, #f4f4f4); color: var(--global-palette3, #000a28); outline: none; }
.aaz3d-btn[aria-pressed="true"] { background: var(--global-palette3, #000a28); color: var(--global-palette9, #fff); }
.aaz3d-stage[data-mode="tirage"] .aaz3d-only-cadre { display: none; }
/* « Chez moi » : l'œuvre au mur en réalité augmentée (fonction en plus, hors des barres) : petit bouton rond
   en bas à droite, juste au-dessus des barres ; une bulle « Voir chez moi » s'affiche quelques secondes la 1re fois.
   Seulement si le téléphone sait le faire. */
.aaz3d-home {
	position: absolute; right: 12px; bottom: calc(132px + env(safe-area-inset-bottom, 0px)); z-index: 4;
	display: none; align-items: center; justify-content: center; gap: 7px; height: 40px; padding: 0 15px 0 12px; margin: 0; min-height: 0;
	border: 0; border-radius: 20px; background: var(--global-palette9, #fff); color: var(--global-palette3, #000a28);
	font-family: inherit; font-size: 14px; font-weight: 600; line-height: 1; letter-spacing: 0; text-transform: none; white-space: nowrap;
	box-shadow: 0 2px 14px rgba(0, 10, 40, .12); cursor: pointer; transition: background .2s, opacity .2s;
}
/* « Chez moi » : maison + mot, toujours visible (choix D du 23/10) */
.aaz3d-home svg { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.aaz3d-home-lbl { pointer-events: none; }
.aaz3d-home:hover, .aaz3d-home:focus-visible { background: var(--global-palette8, #f4f4f4); color: var(--global-palette3, #000a28); outline: none; }
.aaz3d-stage.can-ar.is-ready .aaz3d-home { display: inline-flex; }
.aaz3d-home[aria-busy="true"] { opacity: .6; pointer-events: none; }
/* boutons (26/10) : même taille partout (+12 %), plus espacés ; textes de la barre du bas tant qu'ils tiennent
   (calculé par le script : « Plein écran » passe d'abord en icône seule, puis toutes les icônes seules) */
.aaz3d-stage.nav-fs-icon .aaz3d-nav [data-act="fs"] .aaz3d-lbl,
.aaz3d-stage.nav-compact .aaz3d-nav .aaz3d-lbl { display: none; }
.aaz3d-stage.nav-compact .aaz3d-nav .aaz3d-btn { padding: 0 9px; }
/* hauteur des barres : téléphone 33 px du bas, ordinateur 16 px (plus bas) */
@media (max-width: 767px) {
	.aaz3d-bars { bottom: calc(33px + env(safe-area-inset-bottom, 0px)); }
	.aaz3d-home { bottom: calc(155px + env(safe-area-inset-bottom, 0px)); }
}
@container (max-width: 340px) {
	.aaz3d-poi .aaz3d-lbl { display: none; }
}

/* points d'intérêt sur le modèle */
.aaz3d-hot {
	position: relative; width: 22px; height: 22px; padding: 0; border-radius: 50%; cursor: pointer;
	background: var(--global-palette9, #fff); border: 2px solid var(--global-palette3, #000a28); box-shadow: 0 1px 6px rgba(0, 0, 0, .25);
	transition: opacity .25s, transform .2s; min-height: 0;
}
.aaz3d-hot::after { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: var(--global-palette15, #beb358); }
.aaz3d-hot:hover { transform: scale(1.12); }
.aaz3d-hot.is-hidden { opacity: 0; pointer-events: none; }
.aaz3d-hot-lbl {
	position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%); padding: 5px 9px; border-radius: 999px;
	background: var(--global-palette3, #000a28); color: var(--global-palette9, #fff); font-size: 12px; white-space: nowrap;
	opacity: 0; transition: opacity .2s; pointer-events: none;
}
.aaz3d-hot:hover .aaz3d-hot-lbl, .aaz3d-hot:focus-visible .aaz3d-hot-lbl { opacity: 1; }
.aaz3d-stage[data-mode="tirage"] .aaz3d-hot[data-act="hang"] { display: none; }
.aaz3d-stage.show-dims .aaz3d-hot { opacity: 0; pointer-events: none; }

/* cotes : traits fins, étiquettes pleines au-dessus des traits */
.aaz3d-dimpt { width: 1px; height: 1px; pointer-events: none; opacity: 0; }
.aaz3d-dimlines { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; overflow: visible; }
.aaz3d-dimlines line { stroke: var(--global-palette3, #000a28); stroke-width: 1.5; stroke-linecap: round; }
.aaz3d-dimlabels { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.aaz3d-dimlbl {
	position: absolute; transform: translate(-50%, -50%); padding: 5px 11px; border-radius: 999px;
	background: var(--global-palette3, #000a28); color: #fff; opacity: 1; font-size: 13px; font-weight: 600; line-height: 1.15;
	letter-spacing: .01em; white-space: nowrap; box-shadow: 0 1px 6px rgba(0, 10, 40, .2);
}
.aaz3d-dimlbl.is-side { transform: translate(10px, -50%); }

/* après un clic sur un point d'intérêt, les points disparaissent (ils reviennent avec « Réinitialiser la vue ») */
.aaz3d-mv[data-view="sig"] .aaz3d-hot,
.aaz3d-mv[data-view="seal"] .aaz3d-hot,
.aaz3d-mv[data-view="hang"] .aaz3d-hot { opacity: 0; pointer-events: none; }

/* pagination : cube à la place du point de la vue 3D. Le bouton garde la taille d'un point (8 px),
   le cube de 16 px est centré dessus : il reste aligné sur les points quel que soit le navigateur. */
.splide .splide__pagination .splide__pagination__page.aaz3d-dot {
	position: relative; display: inline-block; width: 8px; height: 8px; margin: 0 4px; padding: 0; overflow: visible; vertical-align: middle;
	background: transparent !important; border: 0; border-radius: 0; opacity: .45; transform: none !important; box-shadow: none; min-height: 0;
}
.splide .splide__pagination .splide__pagination__page.aaz3d-dot svg {
	position: absolute; left: 50%; top: 50%; width: 16px; height: 16px; transform: translate(-50%, -50%);
	fill: none; stroke: var(--global-palette3, #000a28); stroke-width: 1.8; stroke-linejoin: round;
}
.splide .splide__pagination .splide__pagination__page.aaz3d-dot:hover { opacity: .75; }
.splide .splide__pagination .splide__pagination__page.aaz3d-dot.is-active { opacity: 1; background: transparent !important; transform: none !important; }
.splide .splide__pagination .splide__pagination__page.aaz3d-dot.is-active .aaz3d-cube-f { fill: var(--global-palette3, #000a28); }
.splide .splide__pagination .splide__pagination__page.aaz3d-dot.is-active .aaz3d-cube-l { stroke: var(--global-palette9, #fff); }

/* vignette et pagination */
.aaz3d-thumb { display: flex; align-items: center; justify-content: center; background: var(--global-palette8, #f4f4f4); }
.aaz3d-thumb-in { font-weight: 700; font-size: 14px; letter-spacing: .05em; color: var(--global-palette3, #000a28); }

/* agrandissement des photos (GLightbox) : la vue 3D en dernière image, une vignette « Ouvrir la vue 3D » */
.aaz3d-lb { display: none !important; }
#aaz3d-lb-card { display: none; }
.glightbox-container .gslide-inline:has(.aaz3d-lbcard) { background: transparent; box-shadow: none; overflow: visible; }
.glightbox-container .aaz3d-lbcard { display: block; padding: 0; text-align: center; background: transparent; }
.aaz3d-lbcard-in {
	position: relative; display: inline-block; max-width: 100%; padding: 0; margin: 0; border: 0; border-radius: 0;
	background: transparent; cursor: pointer; line-height: 0; -webkit-tap-highlight-color: transparent;
}
.aaz3d-lbcard-in img { display: block; width: auto; max-width: 100%; max-height: 82vh; height: auto; margin: 0 auto; box-shadow: var(--glightbox-image-shadow, 1px 2px 9px rgba(0, 0, 0, .65)); }
.aaz3d-lbcard-in::after { content: ""; position: absolute; inset: 0; background: radial-gradient(closest-side, rgba(0, 10, 40, .38), rgba(0, 10, 40, 0)); transition: opacity .2s; }
.aaz3d-lbcard-in:hover::after, .aaz3d-lbcard-in:focus-visible::after { opacity: .7; }
.aaz3d-lbcard-cta {
	position: absolute; left: 50%; top: 50%; z-index: 1; transform: translate(-50%, -50%);
	display: inline-flex; align-items: center; gap: 9px; height: 48px; padding: 0 22px 0 16px; border-radius: 999px;
	background: var(--global-palette9, #fff); color: var(--global-palette3, #000a28); box-shadow: 0 4px 22px rgba(0, 10, 40, .28);
	font-family: inherit; font-size: 15px; font-weight: 600; line-height: 1; letter-spacing: 0; white-space: nowrap;
}
.aaz3d-lbcard-cta svg { width: 24px; height: 24px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
