
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#090807}
body{overflow-x:hidden}
.page{position:relative;width:100vw;overflow:hidden}
.hero{display:block;width:100vw;height:auto}
.menu-maitre{position:absolute;left:0;top:0;width:100%;height:auto;z-index:3;pointer-events:none}
.hotspots{position:absolute;inset:0;z-index:5;pointer-events:none}
.hotspot{position:absolute;display:block;cursor:pointer}
.hotspots .hotspot{pointer-events:auto}
.logo{left:0;top:0;width:15%;height:10.5%}
.nav-sentier{left:15%;top:0;width:16%;height:10.5%}
.nav-bibliotheque{left:31%;top:0;width:15.5%;height:10.5%}
.nav-atelier{left:46.5%;top:0;width:14.5%;height:10.5%}
.nav-etoiles{left:61%;top:0;width:14.5%;height:10.5%}
.nav-salon{left:75.5%;top:0;width:15%;height:10.5%}
.nav-contact{left:90.5%;top:0;width:9.5%;height:10.5%}
.active-paw{position:absolute;top:7.0%;width:2.2%;min-width:22px;color:#dcae43;z-index:6;filter:drop-shadow(0 0 2px rgba(0,0,0,.7));pointer-events:none}
.active-paw svg{display:block;width:100%;height:auto}
.paw-sentier{left:20.4%}
.paw-bibliotheque{left:35.7%}
.paw-atelier{left:50.2%}
.paw-etoiles{left:60.4%}
.paw-salon{left:82.0%}
.paw-contact{left:94.0%}
@media (max-width:600px){.active-paw{min-width:13px}}
.content-hotspots{position:absolute;inset:0;z-index:4;pointer-events:none}
.content-hotspots .hotspot{pointer-events:auto}

/* ---- Halo doré discret et permanent, pour signaler les zones cliquables (livres, portes, tiroirs, feuillets...) ---- */
.spot-twinkle{position:absolute;width:0;height:0;pointer-events:none;z-index:4}
.spot-glow{
  position:absolute;left:-12px;top:-12px;width:24px;height:24px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,241,204,.85) 0%,rgba(220,174,67,.5) 32%,rgba(220,174,67,.16) 58%,rgba(220,174,67,0) 76%);
  mix-blend-mode:screen;animation:spot-glow-pulse 4.2s ease-in-out infinite;
}
.spot-spark{
  position:absolute;left:-1.5px;top:-1.5px;width:3px;height:3px;border-radius:50%;background:#fff6dc;
  box-shadow:0 0 4px 1.5px rgba(255,241,204,.85),0 0 10px 4px rgba(220,174,67,.4);
  mix-blend-mode:screen;animation:spot-spark-pulse 4.2s ease-in-out infinite;
}
.spot-spark::before,.spot-spark::after{content:'';position:absolute;top:50%;left:50%;background:linear-gradient(90deg,transparent,rgba(255,241,204,.6),transparent)}
.spot-spark::before{width:18px;height:1px;transform:translate(-50%,-50%)}
.spot-spark::after{width:1px;height:18px;transform:translate(-50%,-50%)}
@keyframes spot-glow-pulse{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:.75;transform:scale(1.05)}}
@keyframes spot-spark-pulse{0%,100%{opacity:.3;transform:scale(.6)}50%{opacity:.7;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.spot-glow,.spot-spark{animation:none;opacity:.5}}

/* ---- Sous-menus déroulants : Entrer dans l'atelier ---- */
.nav-atelier-wrap{position:absolute;left:46.5%;top:0;width:14.5%;height:10.5%;pointer-events:auto}
.nav-atelier-wrap .hotspot.nav-atelier{position:static;width:100%;height:100%}
.atelier-dropdown{position:absolute;top:100%;left:50%;transform:translateX(-50%);display:none;flex-direction:column;background:#090807;border:1px solid rgba(220,174,67,.3);min-width:230px;z-index:20;box-shadow:0 10px 24px rgba(0,0,0,.55)}
.nav-atelier-wrap:hover .atelier-dropdown,.nav-atelier-wrap:focus-within .atelier-dropdown{display:flex}
.atelier-dropdown a{display:block;color:#dcae43;text-decoration:none;font-size:.76em;letter-spacing:.05em;text-transform:uppercase;padding:.9em 1.3em;white-space:nowrap;border-bottom:1px solid rgba(220,174,67,.15)}
.atelier-dropdown a:last-child{border-bottom:none}
.atelier-dropdown a:hover{background:rgba(220,174,67,.14);color:#f4eee2}

.home-atelier-wrap{position:absolute;left:2.2%;top:45%;width:18%;height:10.5%;pointer-events:auto}
.home-atelier-wrap .hotspot.home-link-atelier{position:static;width:100%;height:100%}
.home-atelier-dropdown{position:absolute;top:100%;left:0;width:100%;margin-top:2px;display:none;flex-direction:column;background:#090807;border:1px solid rgba(220,174,67,.3);z-index:20;box-shadow:0 10px 24px rgba(0,0,0,.55)}
.home-atelier-wrap:hover .home-atelier-dropdown,.home-atelier-wrap:focus-within .home-atelier-dropdown{display:flex}
.home-atelier-dropdown a{display:block;color:#dcae43;text-decoration:none;font-size:.76em;letter-spacing:.05em;text-transform:uppercase;padding:.9em 1.3em;white-space:nowrap;border-bottom:1px solid rgba(220,174,67,.15)}
.home-atelier-dropdown a:last-child{border-bottom:none}
.home-atelier-dropdown a:hover{background:rgba(220,174,67,.14);color:#f4eee2}

/* ---- Pages textes ---- */
.text-page{background:#f2e9d8;color:#2d2117;font-family:Georgia,serif;min-height:100vh;margin:0}
.text-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:1.6em;padding:1.1em 1em;background:#090807;border-bottom:1px solid rgba(220,174,67,.25)}
.text-nav a{color:#dcae43;text-decoration:none;font-size:.8em;letter-spacing:.06em;text-transform:uppercase}
.text-nav a:hover{text-decoration:underline}
.text-nav a[aria-current="page"]{color:#f4eee2;border-bottom:1px solid #dcae43;padding-bottom:2px}
.text-article{max-width:680px;margin:0 auto;padding:3.5em 6vw 5em}
.text-article h1{font-weight:normal;text-align:center;margin:0 0 .3em;font-size:1.9em}
.text-article .subtitle{text-align:center;color:#b08a4a;font-style:italic;margin:0 0 2.2em;font-size:.95em}
.text-article .ornament{text-align:center;color:#8a642c;margin:0 0 2em;letter-spacing:.4em}
.text-article p{text-align:justify;hyphens:none;-webkit-hyphens:none;line-height:1.75;margin:0 0 1.2em}
.text-article .credit{text-align:right;font-style:italic;color:#b08a4a;margin:1.6em 0 0;font-size:.9em}
.text-article .poem p{text-align:center;line-height:1.9;margin:0 0 1.4em}
.text-article .speaker{color:#8a642c;letter-spacing:.06em;margin:1.6em 0 .3em;font-weight:bold;text-align:left}
.text-article .stage{font-style:italic;color:#b08a4a;text-align:left}
.text-article .dialogue{text-align:left;margin:0 0 .2em}
.text-article h2{font-weight:normal;color:#8a642c;text-align:center;margin:2.6em 0 .2em;font-size:1.3em}
.text-article .synopsis-label{font-style:italic;color:#b08a4a;text-align:center;margin:0 0 1em}
.text-article .oeuvre-note{text-align:center;font-style:italic;color:#b08a4a;margin:.6em 0 0}
.text-back{text-align:center;margin-top:3em}
.text-back a{color:#8a642c;text-decoration:none;border:1px solid rgba(138,100,44,.4);padding:.6em 1.5em;border-radius:2px;font-size:.85em;letter-spacing:.03em}
.text-back a:hover{background:rgba(138,100,44,.1)}
@media (max-width:600px){.text-nav{gap:1em .9em}.text-nav a{font-size:.72em}.text-article{padding:2.5em 7vw 4em}}

/* ---- Lecteur audio (pages-poèmes) ---- */
.listen-button{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.6em;
  margin:0 auto 2.4em;
  padding:.75em 1.9em;
  border:1px solid rgba(138,100,44,.5);
  border-radius:30px;
  background:transparent;
  color:#8a642c;
  font-family:Georgia,serif;
  font-size:.85em;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
  width:max-content;
}
.listen-button:hover{
  background:rgba(138,100,44,.08);
  border-color:rgba(138,100,44,.8);
  color:#6b4d21;
}
.listen-button .listen-icon{
  font-size:1em;
  line-height:1;
}
.listen-button.is-loading .listen-icon{opacity:.5}

/* ---- Pages de genre (Bibliothèque) : illustration + texte ---- */
.library-category{max-width:880px}
.library-category .work-list{display:flex;flex-direction:column;gap:3.2em;margin-top:1em}
.library-category .work-list article{display:block}
.library-category .work-list article.has-icon{display:flex;align-items:center;gap:2.6em}
.library-category .work-list article.has-icon:nth-child(even){flex-direction:row-reverse}
.library-category .work-icon{flex:0 0 38%;width:38%;max-width:300px;height:auto;display:block;filter:drop-shadow(0 10px 18px rgba(45,33,23,.22))}
.library-category .work-copy{flex:1;min-width:0}
.library-category .work-copy h2{text-align:left;margin-top:0}
.library-category .work-copy .text-back,.library-category .work-copy .oeuvre-note{text-align:left;margin-top:1.4em}
.library-category .work-list article:not(.has-icon) h2{text-align:center}
@media (max-width:640px){
 .library-category .work-list article.has-icon,.library-category .work-list article.has-icon:nth-child(even){flex-direction:column;gap:1.4em;text-align:center}
 .library-category .work-icon{flex:none;width:64%;max-width:260px}
 .library-category .work-copy h2,.library-category .work-copy .text-back,.library-category .work-copy .oeuvre-note{text-align:center}
}
.library-category .work-list article:not(.has-icon) p{text-align:center}
.library-category .work-list article.text-only{text-align:center}
.library-category .work-list article.text-only h2{margin-bottom:.3em}
.library-category .work-list article.text-only p{margin-bottom:0}
.library-category .work-list article.text-only .text-back{margin-top:1.4em}
.library-category .work-icon.work-icon-wide{flex:0 0 46%;width:46%;max-width:380px}
@media (max-width:640px){.library-category .work-icon.work-icon-wide{flex:none;width:86%;max-width:340px}}

/* Circulation entre les rubriques de la bibliothèque */
.library-category .breadcrumb{display:block;font-size:.78em;letter-spacing:.1em;text-transform:uppercase;color:#8a642c;text-decoration:none;margin:0 0 2.2em;opacity:.85}
.library-category .breadcrumb:hover{opacity:1;color:#b08a4a}
.library-category .end-mark{text-align:center;color:#8a642c;font-size:1.2em;letter-spacing:.3em;margin:3em 0 2.4em}
.library-category .nav-footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1em;padding-top:1.8em;border-top:1px solid rgba(138,100,44,.28)}
.library-category .nav-footer a{color:#8a642c;text-decoration:none;font-size:1.05em;letter-spacing:.03em}
.library-category .nav-footer a:hover{color:#b08a4a}
