/* ROSA — démonstration de site 3D. Même identité que le site : Obsidian,
   blanc, corail en accent seulement. */
:root{--obsidian:#0B0C0E;--blanc:#fff;--corail:#FF3B5C;--encre:#E9ECF1;--encre-2:#AEB4BE;--verre:rgba(18,20,24,.82);--liseret:rgba(255,255,255,.14)}
*{box-sizing:border-box}
/* !important : base.css (body{background:... !important}) et rosa.css, chargées avant pour l'en-tête commun, peignaient le corps en blanc. */
html,body{margin:0;height:100%;background:var(--obsidian)!important;color:var(--encre)!important;font-family:Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
/* En-tête et pied : ceux du site (assets/rosa.css, chargée avant) — contre-audit du 13/10/2026, m1. L'ancienne
   barre fixe (.xp-barre) a disparu ; la scène occupe la hauteur restante sous l'en-tête collant. */
/* Titre de page lu par les moteurs et les lecteurs d'écran, hors du cadre visuel. */
.xp-hors-ecran{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.xp-titre{margin:0 0 10px;font-family:Poppins,sans-serif;font-weight:600;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--encre-2)}
.xp-titre span{color:var(--corail)}
.xp-cta{display:inline-block;padding:12px 22px;border-radius:999px;background:var(--corail);color:#0B0C0E!important;font-family:Poppins,sans-serif;font-weight:700;font-size:15px;text-decoration:none;white-space:nowrap}
.xp-cta:hover{background:#FF6B84}
.xp-scene{position:relative;height:calc(100vh - var(--h-entete,76px));height:calc(100svh - var(--h-entete,76px));overflow:hidden;touch-action:none;cursor:grab}
.xp-scene:active{cursor:grabbing}
#xp-canvas{display:block;width:100%;height:100%}
.xp-chargement{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:14px;font-family:Poppins,sans-serif;font-size:15px;color:var(--encre-2);background:var(--obsidian);transition:opacity .6s}
.xp-chargement span{width:34px;height:34px;border-radius:50%;border:3px solid rgba(255,255,255,.15);border-top-color:var(--corail);animation:xp-tour 1s linear infinite}
@keyframes xp-tour{to{transform:rotate(360deg)}}
.xp-chargement.fini{opacity:0;pointer-events:none}
.xp-points{position:absolute;inset:0;pointer-events:none}
.xp-point{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:2px solid #fff;background:rgba(255,59,92,.85);
  box-shadow:0 0 0 6px rgba(255,59,92,.25),0 6px 18px rgba(0,0,0,.4);pointer-events:auto;cursor:pointer;padding:0}
.xp-point::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:1px solid rgba(255,59,92,.6);animation:xp-onde 2.2s ease-out infinite}
@keyframes xp-onde{from{transform:scale(.6);opacity:1}to{transform:scale(1.5);opacity:0}}
.xp-point:focus-visible{outline:3px solid #fff;outline-offset:4px}
.xp-fiche{position:absolute;right:clamp(12px,3vw,32px);bottom:clamp(120px,16vh,170px);width:min(360px,calc(100% - 24px));padding:22px 22px 20px;border-radius:18px;
  background:var(--verre);border:1px solid var(--liseret);backdrop-filter:blur(14px);box-shadow:0 30px 70px rgba(0,0,0,.5)}
.xp-fiche h2{margin:6px 0 8px;font-family:Poppins,sans-serif;font-weight:700;font-size:22px;color:#fff;letter-spacing:-.01em}
.xp-fiche p{margin:0;font-size:15px;line-height:1.5;color:var(--encre-2)}
.xp-fiche-sur{font-family:Poppins,sans-serif;font-weight:600;font-size:11px!important;letter-spacing:.2em;text-transform:uppercase;color:var(--corail)!important}
.xp-fiche-btn{display:inline-block;margin-top:16px;padding:10px 16px;border-radius:999px;border:1px solid var(--liseret);color:#fff;text-decoration:none;font-weight:600;font-size:14px}
.xp-fermer{position:absolute;right:10px;top:8px;width:34px;height:34px;border:0;border-radius:50%;background:transparent;color:#fff;font-size:22px;cursor:pointer}
.xp-aide{position:absolute;left:50%;top:16px;transform:translateX(-50%);margin:0;padding:8px 14px;border-radius:999px;background:rgba(11,12,14,.6);font-size:13px;color:var(--encre-2);white-space:nowrap;transition:opacity .8s}
.xp-mention{position:absolute;left:clamp(12px,3vw,32px);bottom:clamp(120px,16vh,170px);font-family:Poppins,sans-serif;font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--encre-2);border:1px solid var(--liseret);border-radius:999px;padding:6px 12px;background:rgba(11,12,14,.5)}
.xp-univers{position:fixed;left:50%;bottom:clamp(58px,8vh,78px);transform:translateX(-50%);z-index:20;display:flex;gap:6px;padding:6px;border-radius:999px;
  background:var(--verre);border:1px solid var(--liseret);backdrop-filter:blur(12px);max-width:calc(100% - 20px);overflow-x:auto}
.xp-univers button,.xp-commandes button{border:0;border-radius:999px;padding:10px 16px;background:transparent;color:var(--encre-2);font-family:Poppins,sans-serif;font-weight:600;font-size:14px;cursor:pointer;white-space:nowrap}
.xp-univers button[aria-pressed="true"]{background:#fff;color:#0B0C0E}
.xp-commandes{position:fixed;left:50%;bottom:clamp(10px,2vh,20px);transform:translateX(-50%);z-index:20;display:flex;align-items:center;gap:6px}
.xp-commandes button{background:rgba(18,20,24,.8);border:1px solid var(--liseret);color:#fff}
.xp-commandes #xp-visite[aria-pressed="true"]{background:var(--corail);color:#0B0C0E;border-color:var(--corail)}
.xp-leger{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--encre-2);padding:0 8px;cursor:pointer}
.xp-leger input{accent-color:var(--corail);margin:0;color:var(--encre-2)}
.xp-infos{max-width:760px;margin:0 auto;padding:70px 22px 90px;line-height:1.6}
.xp-infos h2{font-family:Poppins,sans-serif;font-weight:800;font-size:clamp(26px,4vw,36px);letter-spacing:-.02em;color:#fff;margin:0 0 14px}
.xp-infos a{color:var(--corail)}
/* Mode capture (vidéos ROSA) : l'interface s'efface, seule la scène reste. */
html.capture .entete,html.capture .pied,html.capture .xp-univers,html.capture .xp-commandes,html.capture .xp-infos,html.capture .xp-aide,html.capture .saut-contenu{display:none}
html.capture .xp-scene{height:100vh;height:100svh}
html.capture .xp-scene{cursor:default}
@media (max-width:640px){.xp-titre{display:none}.xp-aide{white-space:normal;text-align:center;width:88%;border-radius:14px}
  /* Téléphone : les univers défilent horizontalement, les commandes passent à la ligne
     et se tiennent au-dessus de la barre système. */
  .xp-univers{width:92%;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;border-radius:18px;bottom:calc(104px + env(safe-area-inset-bottom))}
  .xp-univers::-webkit-scrollbar{display:none}
  .xp-commandes{flex-wrap:wrap;justify-content:center;width:92%;bottom:calc(16px + env(safe-area-inset-bottom))}
  .xp-leger{order:1;flex-basis:100%;max-width:max-content;margin:8px auto 0;padding:7px 14px;border-radius:999px;
    background:rgba(18,20,24,.8);border:1px solid var(--liseret);color:#fff;font-size:12px;white-space:nowrap}
  .xp-fiche{bottom:calc(196px + env(safe-area-inset-bottom));right:4%;left:4%;width:auto}
  .xp-mention{bottom:auto;top:84px;left:4%}}
@media (prefers-reduced-motion:reduce){.xp-point::after,.xp-chargement span{animation:none}}


/* La case « Mode léger » et son texte formaient une cible de 19 px de haut.
   WCAG 2.2 en demande 24. Mesuré par outils-site/audit_navigateur.py. */
.xp-leger{display:inline-flex;align-items:center;gap:6px;min-height:24px}

/* Affiche statique affichée avant la scène WebGL (performance : la scène ne se
   charge qu'au clic). Lisible sans JavaScript ; le bouton n'apparaît qu'avec. */
.xp-chargement[hidden],.xp-affiche[hidden],.xp-lancer[hidden]{display:none}
.xp-scene:focus{outline:none}
.xp-scene:focus-visible{outline:3px solid #fff;outline-offset:-3px}
.xp-affiche{position:absolute;inset:0;z-index:6;display:grid;place-items:center;padding:56px 16px 190px;background:var(--obsidian);
  touch-action:auto;cursor:default;transition:opacity .6s ease}
.xp-affiche picture,.xp-affiche img{position:absolute;inset:0;width:100%;height:100%}
.xp-affiche img{object-fit:cover;object-position:0 50%}
.xp-affiche::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(11,12,14,.35),rgba(11,12,14,.15) 40%,rgba(11,12,14,.55))}
.xp-affiche.fini{opacity:0;pointer-events:none}
.xp-affiche-carte{position:relative;z-index:1;max-width:440px;padding:24px 24px 22px;border-radius:20px;text-align:center;
  background:rgba(11,12,14,.86);border:1px solid var(--liseret);box-shadow:0 30px 70px rgba(0,0,0,.45)}
.xp-affiche-titre{margin:0 0 8px;font-family:Poppins,sans-serif;font-weight:800;font-size:clamp(22px,3vw,28px);letter-spacing:-.01em;color:#fff}
.xp-affiche-texte{margin:0 0 18px;font-size:15px;line-height:1.5;color:var(--encre-2)}
.xp-lancer{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 26px;border:0;border-radius:999px;
  background:var(--corail);color:#0B0C0E;font-family:Poppins,sans-serif;font-weight:700;font-size:16px;cursor:pointer;
  box-shadow:0 10px 30px rgba(255,59,92,.35)}
.xp-lancer:hover{filter:brightness(1.06)}
.xp-lancer:focus-visible{outline:3px solid #fff;outline-offset:3px}
.xp-affiche-etat{margin:0;font-family:Poppins,sans-serif;font-size:15px;color:var(--encre)}
.xp-affiche-etat:empty{display:none}
.xp-affiche-etat.en-cours::before{content:"";display:inline-block;width:18px;height:18px;margin-right:10px;vertical-align:-4px;border-radius:50%;
  border:3px solid rgba(255,255,255,.2);border-top-color:var(--corail);animation:xp-tour 1s linear infinite}
html.capture .xp-affiche{display:none}
@media (max-width:640px){.xp-affiche img{object-position:42% 50%}.xp-affiche{padding:120px 14px 200px}.xp-affiche-carte{padding:20px 18px 18px}}
@media (prefers-reduced-motion:reduce){.xp-affiche{transition:none}.xp-affiche-etat.en-cours::before{animation:none}}