:root{--paper:#fbf9f4;--ink:#413b32;--gold:#a3824f;--line:#d9ccb5;--serif:Georgia,'Times New Roman',serif;--sans:'Helvetica Neue',Arial,sans-serif;color-scheme:light}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:400}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.35}a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button{border:0;background:transparent}button[hidden],[hidden]{display:none!important}.masthead{height:106px;max-width:1600px;margin:auto;padding:0 6.1%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e9e3d8}.wordmark{text-align:center;text-decoration:none}.brand-name{display:block;font:20px var(--serif);letter-spacing:2.5px}.brand-place{display:block;font-size:7px;letter-spacing:2.2px;margin-top:9px;color:var(--gold)}.brand-place span{padding:0 7px}.edition{font-size:10px;letter-spacing:2.4px;color:var(--gold)}.edition i{font:italic 24px var(--serif);padding-left:10px;letter-spacing:0}.intro{text-align:center;padding:46px 20px 4px}.overline{font-size:9px;letter-spacing:3px;color:var(--gold);line-height:1.8}.intro h1{font:normal clamp(34px,3.2vw,49px)/1.1 var(--serif);margin:14px 0}.intro h1 em{font-weight:normal;color:var(--gold)}.intro>p:last-child{font:13px/1.8 var(--sans);color:#837969;letter-spacing:.1px;margin-bottom:0}.mobile-only{display:none}.experience{position:relative;max-width:1260px;margin:6px auto 0}.scene-window{width:100%;overflow:hidden;position:relative}.scene-stage{width:100%;position:relative;aspect-ratio:1448/1086;background:#fff}.scene-stage canvas,.poster,.hotspots{position:absolute;inset:0;width:100%;height:100%}.poster{object-fit:contain}.scene-stage canvas{opacity:0;transition:opacity .35s}.ready .scene-stage canvas{opacity:1}.scene-stage:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 55px 45px var(--paper)}.hotspots{z-index:2;pointer-events:none}.hotspot{position:absolute;pointer-events:auto;border-radius:8px;transition:filter .25s;background:transparent}.hotspot:hover,.hotspot:focus-visible{filter:drop-shadow(0 0 8px #d9ac4c99)}.book-hotspot{left:20.1%;top:76.9%;width:9.5%;height:5.5%;transform:rotate(3deg)}.gift-0{left:82.3%;top:80.3%;width:4.4%;height:7.8%}.gift-1{left:86%;top:82.1%;width:5.5%;height:7.3%}.gift-2{left:91.5%;top:83.3%;width:6%;height:7.3%}.gift-3{left:90%;top:74.4%;width:6.5%;height:9%}.hotspot-point{position:absolute;right:-7px;top:-7px;display:grid;place-items:center;width:23px;height:23px;border:1px solid #b7935599;border-radius:50%;background:#fffdf8d9;color:var(--gold);font:17px var(--serif);box-shadow:0 0 0 4px #fff9;transition:transform .3s,background .3s}.hotspot:hover .hotspot-point,.hotspot:focus-visible .hotspot-point{transform:rotate(90deg);background:#f0e3c7}.hint{position:absolute;bottom:calc(100% + 12px);left:50%;transform:translate(-50%,5px);white-space:nowrap;padding:10px 14px;background:#fffdf8;box-shadow:0 3px 18px #765c2420;color:#8c6d36;font:italic 14px var(--serif);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.hotspot:hover .hint,.hotspot:focus-visible .hint{opacity:1;transform:translate(-50%,0)}.gift-2 .hint,.gift-3 .hint{left:auto;right:0;transform:translateY(5px)}.gift-2:hover .hint,.gift-3:hover .hint{transform:translateY(0)}.scene-caption{display:flex;align-items:center;justify-content:space-between;padding:8px 4.5% 16px;color:#a1927e;font-size:8px;letter-spacing:1.8px}.scene-caption button{letter-spacing:.4px;font-size:10px;padding:10px 0 10px 20px}.scene-caption button span:first-child{font-size:12px;padding-right:6px}.live-dot{display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--gold);margin:0 8px 2px 0}.paused .live-dot{background:#c4bbaa}.loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:16px;color:var(--gold);background:#fbf9f4b8;font:italic 20px var(--serif);z-index:4;transition:opacity .4s}.loading-star{font-size:32px;animation:star 3s linear infinite}.ready .loading{opacity:0;pointer-events:none}@keyframes star{to{transform:rotate(180deg)}}.discovery{max-width:1040px;margin:8px auto 60px;display:flex;justify-content:center;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:27px 15px;gap:45px}.discovery-book{display:flex;align-items:center;gap:26px;font:25px var(--serif);padding:7px}.discovery i{font-weight:normal;color:var(--gold)}.nav-number{font:9px var(--sans);letter-spacing:1px;color:var(--gold)}.nav-arrow{font:20px var(--serif);color:var(--gold);margin-left:20px}.nav-divider{height:34px;width:1px;background:var(--line);margin:0 10px}.gift-shortcuts{display:flex;align-items:center;gap:25px}.gift-label{font:25px var(--serif)}.gift-buttons{display:flex;gap:10px}.gift-buttons button{border:1px solid var(--line);width:31px;height:31px;border-radius:50%;font:11px var(--serif);color:#92703b;transition:background .2s}.gift-buttons button:hover{background:#eee3cf}.mobile-note{display:none}footer{max-width:1440px;display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:30px 6%;border-top:1px solid #e9e3d8;font-size:8px;letter-spacing:1.6px;color:#a79b89}footer span:nth-child(2){font:italic 15px var(--serif);letter-spacing:0}.overlay{border:0;background:#faf7efeF;color:var(--ink);position:fixed;inset:0;margin:0;max-width:none;max-height:none;width:100vw;height:100dvh;overflow:auto;padding:0 5vw;overscroll-behavior:contain}.overlay::backdrop{background:#30271170;backdrop-filter:blur(3px)}.overlay[open]{display:flex;flex-direction:column}.overlay-top{display:flex;justify-content:space-between;align-items:center;flex-shrink:0;padding:20px 0;position:relative;z-index:5}.overlay-top p{font-size:9px;letter-spacing:2.5px;color:var(--gold)}.close-button{display:flex;align-items:center;gap:12px;padding:10px 4px;font-size:11px;letter-spacing:.5px}.close-button span{font:28px var(--serif);color:var(--gold)}.book-space{flex:1;min-height:290px;display:flex;align-items:center;justify-content:center;perspective:2000px;padding:35px 0 15px}.open-book{--leaf:min(38vw,57vh,540px);width:calc(var(--leaf)*2);height:var(--leaf);position:relative;transform-style:preserve-3d;filter:drop-shadow(0 22px 25px #58472833)}.page{position:absolute;top:0;width:50%;height:100%;background:#fdfbf6;border:1px solid #e3d7bf;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:8%;text-align:center;box-shadow:0 3px #e8dfcf,0 5px #fffdf8,0 7px #ded3bc}.left-page{left:0;background:linear-gradient(90deg,#fdfbf8 80%,#eae2d1)}.right-page{left:50%;background:linear-gradient(90deg,#e8decb,#fdfbf8 7%)}.page-copy{font:15px/1.7 var(--serif);max-width:300px}.page-copy h2{font:normal clamp(22px,3vw,38px)/1.2 var(--serif);color:var(--gold);margin:18px 0}.page-copy .folio{font:9px var(--sans);letter-spacing:2px;color:var(--gold)}.page-copy .page-mark{font-size:34px;color:var(--gold)}.page-copy .placeholder{font:9px/1.8 var(--sans);letter-spacing:1px;color:#a18d6f;margin-top:24px}.page img{width:100%;height:100%;object-fit:contain}.page.image-page{padding:0}.book-cover{position:absolute;left:50%;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;z-index:4;transition:transform 850ms cubic-bezier(.35,.05,.25,1)}.cover-front,.cover-back{position:absolute;inset:0;backface-visibility:hidden;background:#fdfbf8;border:1px solid #a88e5d}.cover-front img{width:100%;height:100%;object-fit:fill}.cover-back{transform:rotateY(180deg);background:linear-gradient(90deg,#f7f1e5,#fdfbf8);border-color:#dfd2b9}.cover-back:after{content:'LES ÉTANGS DE COROT';position:absolute;inset:45% 15%;text-align:center;font:9px var(--serif);letter-spacing:3px;color:var(--gold)}.book-is-open .book-cover{transform:rotateY(-179deg)}.book-dialog.is-opening .open-book{transform:translateX(calc(var(--leaf)*-.25)) scale(.9)}.open-book{transition:transform .5s ease}.reader-controls{display:flex;align-items:center;justify-content:center;gap:40px;padding:30px 0 40px;font-size:11px;color:#8e7958;opacity:0;transition:opacity .3s}.book-is-open .reader-controls{opacity:1}.reader-controls button{padding:14px;font:12px var(--sans)}.reader-controls>span{font:italic 15px var(--serif);min-width:100px;text-align:center}.turning-page{display:none;position:absolute;left:50%;top:0;width:50%;height:100%;transform-origin:left;background:#fbf7ee;z-index:3;border:1px solid #e0d2b9;backface-visibility:visible;box-shadow:inset 6px 0 20px #80623715}.turning-page.turn-forward{display:block;animation:turnForward .55s ease-in-out}.turning-page.turn-back{display:block;animation:turnBack .55s ease-in-out}@keyframes turnForward{from{transform:rotateY(0)}to{transform:rotateY(-180deg)}}@keyframes turnBack{from{transform:rotateY(-180deg)}to{transform:rotateY(0)}}.pdf-panel{width:min(100%,1000px);margin:0 auto 30px}.pdf-panel object{width:100%;height:70vh;border:1px solid var(--line);background:#fff}.pdf-panel p{font-size:12px;line-height:1.5}.pdf-panel a{display:block;font-size:12px;color:var(--gold);padding:15px 0}.gift-reveal{flex:1;display:flex;align-items:center;justify-content:center;position:relative;min-height:450px;padding:0 3vw 30px;gap:3vw}.gift-reveal canvas{position:relative;width:min(41vw,530px);height:min(41vw,530px);z-index:1}.gift-glow{position:absolute;left:9%;top:15%;width:40%;height:65%;border-radius:50%;background:radial-gradient(ellipse,#e8c77360,transparent 68%);opacity:0;transform:scale(.6);transition:opacity .8s,transform 1.5s}.gift-glow.lit{opacity:1;transform:scale(1.4)}.gift-copy{max-width:430px;opacity:0;transform:translateY(12px);transition:opacity .6s,transform .6s}.gift-copy.revealed{opacity:1;transform:none}.gift-copy h2{font:normal clamp(30px,3.5vw,48px)/1.12 var(--serif);margin:17px 0 25px}.gift-copy>p:not(.overline):not(.temporary){font:15px/1.8 var(--serif);color:#8c7e67}.gift-copy .temporary{font-size:8px;letter-spacing:1.8px;padding:9px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:#a59070}.gift-copy img{width:100%;max-height:220px;object-fit:cover}.gift-copy a{display:inline-block;font-size:13px;color:var(--gold);padding:12px 0}.text-link{display:block;margin-top:26px;border-bottom:1px solid var(--line);padding:12px 0;font-size:11px;letter-spacing:.5px}.text-link span{margin-left:24px;color:var(--gold)}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.no-script{text-align:center;padding:20px}
@media(min-width:1600px){.experience{max-width:1250px}.intro{padding-top:50px}}@media(max-width:900px){.masthead{padding:0 5%;height:85px}.brand-name{font-size:16px;letter-spacing:1.5px}.brand-place{font-size:6px;letter-spacing:1.2px}.edition{font-size:8px;letter-spacing:1px}.intro{padding-top:35px}.discovery{margin:10px 5% 40px;gap:20px;padding:22px 10px}.discovery-book{font-size:22px;gap:13px}.nav-divider{margin:0}.gift-shortcuts{gap:12px}.gift-label{font-size:22px}.gift-buttons{gap:6px}.nav-arrow{margin-left:4px}footer span:last-child{display:none}.page{padding:5%}.page-copy{font-size:13px}.page-copy .placeholder{font-size:8px;margin-top:14px}.reader-controls{gap:15px}}
@media(max-width:600px){.masthead{height:78px}.brand-name{font-size:14px;letter-spacing:1.4px}.brand-place{font-size:5px;letter-spacing:1.05px;margin-top:7px}.brand-place span{padding:0 3px}.edition{font-size:7px;letter-spacing:1px}.edition i{display:block;font-size:22px;text-align:right;padding:2px 0 0}.intro{padding:32px 16px 15px}.intro h1{font-size:35px;margin:11px 0 13px}.intro .overline{font-size:7px;letter-spacing:2px}.intro>p:last-child{font-size:11px}.mobile-only{display:block}.scene-window{overflow-x:auto;scrollbar-width:thin;scrollbar-color:#c6ad7f transparent;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}.scene-stage{width:920px;max-width:none;height:690px;aspect-ratio:auto}.scene-stage:after{box-shadow:inset 0 0 25px 12px var(--paper)}.experience{margin-top:0}.scene-caption{font-size:6px;letter-spacing:1px;padding:7px 6%}.scene-caption button{font-size:9px}.hotspot-point{width:28px;height:28px;right:-5px;top:-8px}.hotspot{min-width:36px;min-height:40px}.hint{font-size:12px}.discovery{margin:10px 6% 0;flex-direction:column;align-items:stretch;gap:0;padding:0 6px}.discovery-book{width:100%;font-size:25px;padding:22px 0;gap:20px}.nav-arrow{margin-left:auto}.nav-divider{width:100%;height:1px}.gift-shortcuts{padding:20px 0;gap:20px}.gift-label{font-size:23px;white-space:nowrap}.gift-buttons{margin-left:auto;gap:6px}.gift-buttons button{width:30px;height:30px}.mobile-note{display:block;text-align:center;font:italic 12px var(--serif);color:#a08a65;margin:20px 15px 34px}footer{padding:25px 6%;gap:10px}footer span:first-child{font-size:6px;letter-spacing:1px}footer span:nth-child(2){font-size:12px;text-align:right;max-width:155px}.overlay{padding:0 5vw}.overlay-top{padding:12px 0}.overlay-top p{font-size:7px;letter-spacing:1.5px}.close-button{font-size:10px}.book-space{padding:15px 0;min-height:220px;max-height:65vh;flex:1}.open-book{--leaf:44vw}.page-copy{font-size:11px;line-height:1.5}.page-copy h2{font-size:20px;margin:10px 0}.page-copy .folio{font-size:6px;letter-spacing:1px}.page-copy .page-mark{font-size:22px}.page-copy .placeholder{font-size:6px;margin-top:10px;letter-spacing:.6px}.reader-controls{gap:0;padding:15px 0 25px;justify-content:space-between}.reader-controls>span{min-width:80px;font-size:13px}.reader-controls button{font-size:10px;padding:12px 5px}.gift-reveal{flex-direction:column;gap:0;padding:0 0 30px;justify-content:center;min-height:0}.gift-reveal canvas{width:min(80vw,330px);height:min(80vw,330px)}.gift-glow{left:0;top:0;width:100%;height:55%}.gift-copy{text-align:center;max-width:360px}.gift-copy h2{font-size:33px;margin:12px 0 18px}.gift-copy .overline{font-size:8px;letter-spacing:2px}.gift-copy>p:not(.overline):not(.temporary){font-size:14px;line-height:1.6}.text-link{margin:20px auto 0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.loading-star{animation:none}}
.reader-ready .book-cover{visibility:hidden}
/* Embedded integration: the illustration and controls only. */
.embed .masthead,.embed .intro,.embed footer{display:none}.embed .experience{margin-top:0}.embed .discovery{margin-bottom:15px}
@media(max-width:600px){.gift-shortcuts{flex-wrap:wrap}.gift-buttons{width:100%;justify-content:space-between;margin:0 0 0 27px}.gift-buttons button{width:44px;height:44px}.hotspot{min-width:44px;min-height:44px}}
@media(max-width:600px){.open-book{--leaf:84vw;width:var(--leaf);height:var(--leaf)}.left-page{display:none}.right-page,.book-cover,.turning-page{left:0;width:100%}.page{padding:8%}.page-copy{font-size:14px;line-height:1.7}.page-copy h2{font-size:29px;margin:13px 0}.page-copy .folio{font-size:8px;letter-spacing:1.3px}.page-copy .page-mark{font-size:29px}.page-copy .placeholder{font-size:8px;letter-spacing:1px;margin-top:20px}.reader-controls{padding-top:20px}.book-space{max-height:none}}

/* =====================================================================
   Habillage Les Étangs de Corot : polices de la maison, logos,
   brochure réelle en plein écran, boutons des cadeaux, FR / EN.
   ===================================================================== */
:root{--serif:"Cormorant Garamond",Georgia,'Times New Roman',serif;--sans:"Barlow","Helvetica Neue",Arial,sans-serif;
  --red:#9c2a33;--red-deep:#7d212a}
body{-webkit-font-smoothing:antialiased}

/* en-tête : le logo de la maison, l'édition et la langue */
.masthead{height:112px}
.brand-logo{display:block;width:auto;height:62px}
.mast-right{display:flex;align-items:center;gap:26px}
.edition{font-family:var(--sans);font-weight:600;text-transform:uppercase}
.edition i{font-family:var(--serif);font-size:26px;text-transform:none}
.lang{display:flex;align-items:center;font:600 11px/1 var(--sans);letter-spacing:.18em;color:var(--gold)}
.lang button{letter-spacing:inherit;color:inherit;padding:9px 5px;opacity:.55;transition:opacity .2s;position:relative}
.lang button::before{content:"";position:absolute;inset:-8px -4px}
.lang button:hover{opacity:.9}
.lang button[aria-pressed="true"]{opacity:1;cursor:default}
.lang button[aria-pressed="true"] span{border-bottom:1px solid currentColor;padding-bottom:3px}
.lang i{font-style:normal;opacity:.5}

/* introduction */
.overline{font-family:var(--sans);font-weight:600;font-size:10px;text-transform:uppercase}
.intro h1{font-family:var(--serif);font-weight:400;font-size:clamp(38px,3.6vw,56px)}
.intro>p:last-child{font:italic 19px/1.6 var(--serif);color:#837969}
.hint{font-family:var(--serif);font-size:16px}
.scene-caption{font-family:var(--sans);font-weight:600;text-transform:uppercase;font-size:9px}
.scene-caption button{font-family:var(--sans);text-transform:none;font-weight:500}
.discovery-book,.gift-label{font-family:var(--serif);font-size:28px}
.gift-buttons button{font-family:var(--serif);font-size:13px}
.nav-number{font-family:var(--sans);font-weight:600}

/* écran de chargement : le cerf doré qui respire */
.loading{font:italic 22px var(--serif)}
.loading-star{width:30px;aspect-ratio:442/500;background:var(--gold);
  -webkit-mask:url(assets/cerf.png) center/contain no-repeat;mask:url(assets/cerf.png) center/contain no-repeat;
  animation:breathe 1.8s ease-in-out infinite}
@keyframes breathe{50%{opacity:.45;transform:scale(.92)}}

/* pied de page : logo, coordonnées, partenaires */
footer{display:grid;grid-template-columns:auto 1fr auto;gap:40px;align-items:center;padding:34px 6%}
.foot-logo{height:52px;width:auto}
.foot-mid{text-align:center}
.foot-line{margin:0 0 8px;font:italic 19px var(--serif);letter-spacing:0;color:#8c7e67}
.foot-contact{margin:0;font:500 11px/1.6 var(--sans);letter-spacing:.04em;color:#a79b89}
.foot-contact a{text-decoration:none;border-bottom:1px solid var(--line)}
.foot-partners{display:flex;align-items:center;gap:24px}
.foot-partners img{height:42px;width:auto}

/* le livre : pages de garde décoratives pendant l'ouverture */
.page-copy h2{font-family:var(--serif);font-weight:400}
.page-logo{width:52%;height:auto;margin:0 auto 6%}
.page-copy .page-mark{display:block;width:34px;margin:0 auto;aspect-ratio:442/500;background:var(--gold);
  -webkit-mask:url(assets/cerf.png) center/contain no-repeat;mask:url(assets/cerf.png) center/contain no-repeat}
.overlay-top p{font-family:var(--sans);font-weight:600;text-transform:uppercase}
.close-button{font-family:var(--sans);font-weight:500}
.close-button .x{font:28px var(--serif);color:var(--gold)}

/* la vraie brochure, en plein écran, une fois la couverture ouverte */
.book-dialog{overflow:hidden}
.brochure-wrap{position:absolute;left:0;right:0;bottom:0;top:68px;opacity:0;visibility:hidden;
  transition:opacity .7s ease,visibility .7s;background:transparent}
.brochure-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;opacity:0;transition:opacity .5s ease}
.brochure-wrap iframe.loaded{opacity:1}
.brochure-wait{position:absolute;inset:0;display:grid;place-items:center;margin:0;font:italic 18px var(--serif);color:var(--gold);pointer-events:none}
.brochure-wrap iframe.loaded + .brochure-wait{display:none}
.reader-ready .brochure-wrap{opacity:1;visibility:visible}
.book-space{transition:opacity .6s ease}
.reader-ready .book-space{opacity:0;pointer-events:none}

/* les cadeaux : un ou deux boutons */
.gift-copy h2{font-family:var(--serif);font-weight:400}
.gift-copy>p:not(.overline){font-family:var(--serif);font-size:18px}
.gift-copy .overline{font-size:10px}
.gift-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.gift-copy .cta,.gift-ctas .cta{display:inline-block;padding:14px 22px;background:var(--red);color:#fff;border:1px solid var(--red);text-decoration:none;
  font:600 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s}
.gift-ctas .cta:hover{background:var(--red-deep);border-color:var(--red-deep)}
.gift-ctas .cta.ghost{background:transparent;color:var(--red)}
.gift-ctas .cta.ghost:hover{background:var(--red);color:#fff}
.text-link{font-family:var(--sans);font-weight:500}
.text-link .arrow{margin-left:24px;color:var(--gold)}

@media(max-width:900px){
  .brand-logo{height:50px}
  .mast-right{gap:16px}
  footer{grid-template-columns:1fr;text-align:center;gap:18px}
  .foot-logo{margin:0 auto}
  .foot-partners{justify-content:center}
}
@media(max-width:600px){
  .masthead{height:78px}
  .brand-logo{height:40px}
  .edition{display:none}
  .intro h1{font-size:38px}
  .intro>p:last-child{font-size:16px}
  .discovery-book,.gift-label{font-size:25px}
  .brochure-wrap{top:52px}
  .gift-ctas{justify-content:center}
  .gift-copy>p:not(.overline){font-size:16px}
  .foot-contact{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.loading-star{animation:none}}
/* le libellé « Fermer / Close » garde la taille du bouton ; seul le × est en grand */
.close-button span[data-i18n]{font:500 11px var(--sans);letter-spacing:.5px;color:var(--ink)}

/* ---------- étincelles sur les lumières du décor ---------- */
.sparkles{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.sparkles i{position:absolute;transform:translate(-50%,-50%);pointer-events:none}
/* l'éclat : une petite étoile à quatre branches qui s'allume et tourne un peu */
.sparkles .star{width:calc(2% * var(--s,1));aspect-ratio:1;opacity:0;
  background:radial-gradient(circle,#fffaf0 0 10%,rgba(255,250,240,0) 12%),
    conic-gradient(from 45deg,transparent 0 22%,#e7c47a 24% 26%,transparent 28% 47%,#e7c47a 49% 51%,transparent 53% 72%,#e7c47a 74% 76%,transparent 78% 97%,#e7c47a 99%);
  -webkit-mask:radial-gradient(circle,#000 0 30%,transparent 64%);mask:radial-gradient(circle,#000 0 30%,transparent 64%);
  filter:drop-shadow(0 0 4px rgba(255,214,140,.9));
  animation:twinkle var(--t,6s) var(--d,0s) ease-in-out infinite}
@keyframes twinkle{0%,70%,100%{opacity:0;transform:translate(-50%,-50%) scale(.3) rotate(0deg)}
  80%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(25deg)}88%{opacity:0;transform:translate(-50%,-50%) scale(.6) rotate(40deg)}}
/* la lueur : un halo chaud qui vacille comme une flamme */
.sparkles .halo{width:7%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(255,205,120,.55) 0%,rgba(255,205,120,.18) 38%,rgba(255,205,120,0) 70%);
  animation:flicker var(--t,3s) var(--d,0s) ease-in-out infinite}
@keyframes flicker{0%,100%{opacity:.55;transform:translate(-50%,-50%) scale(1)}22%{opacity:.85}45%{opacity:.6;transform:translate(-50%,-50%) scale(1.06)}
  70%{opacity:1;transform:translate(-50%,-50%) scale(.97)}}
.paused .sparkles i{animation-play-state:paused}

/* ---------- pendant la lecture : la réception floutée, toujours animée, en fond ---------- */
.book-dialog{background:transparent}
.book-dialog::backdrop{background:transparent;backdrop-filter:none}
.book-dialog .book-space{display:none}
.bg-scene{position:fixed;inset:-6%;width:112%;height:112%;object-fit:cover;filter:blur(14px) saturate(1.05);
  animation:drift 30s ease-in-out infinite alternate;z-index:0}
@keyframes drift{from{transform:scale(1) translate(0,0)}to{transform:scale(1.06) translate(-1.5%,1%)}}
.bg-veil{position:fixed;inset:0;z-index:0;background:radial-gradient(90% 80% at 50% 50%,rgba(251,249,244,.35),rgba(251,249,244,.7))}
.book-dialog .overlay-top{position:relative;z-index:3;margin:0 -5vw;padding-left:5vw;padding-right:5vw;
  background:linear-gradient(180deg,rgba(251,249,244,.85),rgba(251,249,244,0))}
.book-dialog .brochure-wrap{z-index:2}
@media(prefers-reduced-motion:reduce){.bg-scene{animation:none}}
/* ---------- icônes SVG (identiques sur tous les appareils) ---------- */
.ico{display:inline-block;width:1em;height:1em;vertical-align:-.14em;overflow:visible}
.hotspot-point .ico{width:13px;height:13px}
.nav-arrow .ico{width:18px;height:18px;vertical-align:-3px}
.close-button .x{display:inline-grid;place-items:center}
.close-button .x .ico{width:18px;height:18px}
.text-link .arrow .ico{width:12px;height:12px}
#pauseIcon .ico{width:11px;height:11px;vertical-align:-1px}

/* ====================== L'ouverture du site ====================== */
.opening{position:fixed;inset:0;z-index:9999;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent}
body.opening-on{overflow:hidden}
/* les deux portes, papier crème, filets dorés et poignée */
.door{position:absolute;top:0;bottom:0;width:50.5%;background:#fbf9f4;
  background-image:radial-gradient(120% 80% at 50% 45%,#fdfbf7 0%,#f3ecde 100%);
  transition:transform 1.9s cubic-bezier(.7,0,.15,1);will-change:transform}
.door-l{left:0;box-shadow:inset -1px 0 0 rgba(163,130,79,.55)}
.door-r{right:0;box-shadow:inset 1px 0 0 rgba(163,130,79,.55)}
.door-panel{position:absolute;inset:6vh 4vw;border:1px solid rgba(163,130,79,.35);
  box-shadow:0 0 0 8px rgba(251,249,244,.6),0 0 0 9px rgba(163,130,79,.2)}
.door-l .door-panel{right:2.2vw}.door-r .door-panel{left:2.2vw}
.door-l::after,.door-r::after{content:"";position:absolute;top:68%;width:6px;height:70px;margin-top:-35px;border-radius:3px;
  background:linear-gradient(90deg,#c9a25d,#f0d79a,#b08746)}
.door-l::after{right:2.6vw}.door-r::after{left:2.6vw}
.opening.open .door-l{transform:translateX(-101%)}
.opening.open .door-r{transform:translateX(101%)}
/* au centre : le cerf, le nom, le filet */
.op-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;
  text-align:center;padding:0 24px;transition:opacity .8s ease,transform 1.2s cubic-bezier(.6,0,.2,1)}
.opening.open .op-center{opacity:0;transform:scale(1.08)}
.op-stag{width:62px;aspect-ratio:442/500;
  -webkit-mask:url(assets/cerf.png) center/contain no-repeat;mask:url(assets/cerf.png) center/contain no-repeat;
  background:linear-gradient(105deg,#a3824f 0%,#a3824f 40%,#f6e2ad 50%,#a3824f 60%,#a3824f 100%);background-size:300% 100%;background-position:100% 0;
  clip-path:inset(100% 0 0 0);animation:op-draw 1.5s .25s cubic-bezier(.6,0,.2,1) forwards,op-sheen 1.8s 1.5s ease forwards}
@keyframes op-draw{to{clip-path:inset(0 0 0 0)}}
@keyframes op-sheen{to{background-position:0 0}}
.op-title{margin:6px 0 0;font:400 clamp(30px,5vw,54px)/1 var(--serif);color:var(--ink);letter-spacing:.04em}
.op-title span{display:inline-block;opacity:0;transform:translateY(14px);filter:blur(6px);
  animation:op-letter .9s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(1.1s + var(--i) * 45ms)}
@keyframes op-letter{to{opacity:1;transform:none;filter:blur(0)}}
.op-rule{width:0;height:1px;background:linear-gradient(90deg,transparent,#a3824f,transparent);animation:op-widen 1.4s 2s ease forwards}
@keyframes op-widen{to{width:min(300px,60vw)}}
.op-sub{margin:0;font:600 11px/1 var(--sans);letter-spacing:.34em;text-transform:uppercase;color:var(--gold);
  opacity:0;animation:op-fade 1s 2.3s ease forwards}
@keyframes op-fade{to{opacity:1}}
.op-skip{position:absolute;left:0;right:0;bottom:calc(28px + env(safe-area-inset-bottom,0px));margin:0;text-align:center;
  font:italic 15px var(--serif);color:#a1927e;opacity:0;animation:op-fade 1s 3.2s ease forwards;transition:opacity .4s}
.opening.open .op-skip{opacity:0 !important;animation:none}
/* la lumière qui jaillit entre les portes au moment où elles s'ouvrent */
.op-light{position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;opacity:0;
  background:radial-gradient(closest-side,#fff7dc,rgba(255,231,170,.6) 40%,rgba(255,231,170,0));pointer-events:none}
.opening.open .op-light{animation:op-beam 1.9s cubic-bezier(.6,0,.2,1) forwards}
@keyframes op-beam{0%{opacity:0;width:2px;margin-left:-1px}25%{opacity:1;width:40vw;margin-left:-20vw}100%{opacity:0;width:140vw;margin-left:-70vw}}
.opening.gone{opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s}
/* la réception s'éclaire après l'ouverture des portes */
.opening-on .experience{transform:scale(1.04);filter:brightness(1.08)}
.experience{transition:transform 2.4s cubic-bezier(.2,.7,.2,1),filter 2.4s ease}
/* une pluie d'étincelles accueille le visiteur */
.sparkles.burst .star{animation:twinkle 2.2s calc(var(--b,0) * 1s) ease-out 1,twinkle var(--t,6s) calc(2.4s + var(--d,0s)) ease-in-out infinite}
@media(prefers-reduced-motion:reduce){
  .door,.op-center,.experience{transition:none}.op-stag,.op-title span,.op-rule,.op-sub,.op-skip{animation:none;opacity:1;clip-path:none;transform:none;filter:none}
  .op-rule{width:min(300px,60vw)}
}
.embed .opening{display:none}

/* ====================== Ouverture de la brochure, plus lente et plus douce ====================== */
.book-dialog{opacity:0;transition:opacity 1s ease}
.book-dialog.shown{opacity:1}
.book-dialog .brochure-wrap{transition:opacity 1.2s ease,visibility 1.2s}
.book-dialog .brochure-wrap iframe{transition:opacity 1s ease}
/* ---------- les invitations : une bulle de papier au-dessus de l'objet ---------- */
.invite{position:absolute;bottom:calc(100% + 16px);left:50%;z-index:3;width:max-content;max-width:min(260px,70vw);
  padding:11px 16px 12px;background:#fffdf8;color:#8c6d36;text-align:center;
  font:italic 15px/1.35 var(--serif);box-shadow:0 6px 24px -6px rgba(118,92,36,.28),0 0 0 1px rgba(163,130,79,.22);
  opacity:0;transform:translate(-50%,8px) scale(.96);pointer-events:none;
  transition:opacity .9s ease,transform 1.1s cubic-bezier(.2,.7,.2,1)}
/* la petite pointe sous la bulle */
.invite::after{content:"";position:absolute;top:100%;left:50%;width:10px;height:10px;margin:-5px 0 0 -5px;background:#fffdf8;
  transform:rotate(45deg);box-shadow:1px 1px 0 rgba(163,130,79,.22)}
.hotspot.inviting .invite{opacity:1;transform:translate(-50%,0) scale(1)}
/* l'objet invité respire doucement */
.hotspot.inviting .hotspot-point{animation:invite-pulse 1.6s ease-in-out 2}
@keyframes invite-pulse{50%{transform:scale(1.18);box-shadow:0 0 0 4px #fff9,0 0 0 10px rgba(217,172,76,.22)}}
/* les cadeaux au bord droit du dessin : la bulle s'aligne à droite pour rester visible */
.gift-hotspot .invite{left:auto;right:-6px;transform:translate(0,8px) scale(.96)}
.gift-hotspot.inviting .invite{transform:translate(0,0) scale(1)}
.gift-hotspot .invite::after{left:auto;right:12px}
.hotspot:hover .invite{opacity:0}
@media(max-width:600px){.invite{font-size:13px;max-width:200px;padding:9px 12px}}
@media(prefers-reduced-motion:reduce){.invite{transition:opacity .4s}.hotspot.inviting .hotspot-point{animation:none}}
/* bouton Fermer plus grand et plus visible */
.close-button{gap:12px;padding:12px 18px;border:1px solid rgba(163,130,79,.45);border-radius:999px;background:rgba(255,253,248,.85);transition:background .2s}
.close-button:hover{background:#f0e3c7}
.close-button span[data-i18n]{font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.close-button .x .ico{width:22px;height:22px}
@media(max-width:600px){.close-button{padding:10px 14px}}
