/* Cœurs Métisses: entrée : grandes portes crème, le logo sert de poignée */
body.entree-active{overflow:hidden}
#entree{position:fixed;inset:0;z-index:280;perspective:1800px;background:#fff;transition:opacity 1.1s ease;overflow:hidden}

/* lumière blanche derrière les portes */
.lumiere{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,#fff 0%,#fff 55%,#FFFCF5 100%)}

/* les deux battants plein écran */
.porte{position:absolute;inset:0;cursor:pointer;outline:none;transform-style:preserve-3d}
.battant{position:absolute;top:0;bottom:0;width:50%;background:linear-gradient(90deg,#F8F1E8,#F2E8D9);
  transition:transform 2.2s cubic-bezier(.6,.05,.25,1);will-change:transform;box-shadow:inset 0 0 120px rgba(184,155,112,.18)}
.battant.g{left:0;transform-origin:0 50%;box-shadow:inset -1px 0 0 rgba(184,155,112,.6),inset 0 0 120px rgba(184,155,112,.18)}
.battant.d{right:0;transform-origin:100% 50%;background:linear-gradient(270deg,#F8F1E8,#F2E8D9)}
#entree.ouvre .battant.g{transform:rotateY(-100deg)}
#entree.ouvre .battant.d{transform:rotateY(100deg)}

/* panneaux sculptés en arche (style balinais), ton sur ton */
.arche{position:absolute;top:7vh;bottom:7vh;left:12%;right:12%;border:1px solid rgba(184,155,112,.55);border-radius:999px 999px 0 0}
.arche::before{content:"";position:absolute;inset:14px;border:1px solid rgba(184,155,112,.35);border-radius:999px 999px 0 0}
.arche svg{position:absolute;left:50%;top:9%;width:min(18vmin,120px);transform:translateX(-50%);fill:none;stroke:#B89B70;stroke-width:1.2;opacity:.75}
.arche svg.bas{top:auto;bottom:6%;width:min(14vmin,96px)}

/* le logo actuel, coupé au centre : moitié C sur la porte de gauche, moitié M sur celle de droite */
.poignee{--t:min(24vmin,190px);position:absolute;top:50%;width:calc(var(--t)/2);height:var(--t);margin-top:calc(var(--t)/-2);overflow:hidden;
  filter:drop-shadow(0 10px 18px rgba(74,55,46,.28));transition:transform .5s cubic-bezier(.2,.8,.3,1)}
.poignee img{position:absolute;top:0;width:var(--t);height:var(--t);max-width:none;border-radius:50%}
.battant.g .poignee{right:0}
.battant.g .poignee img{left:0}
.battant.d .poignee{left:0}
.battant.d .poignee img{right:0}
#entree:not(.ouvre) .porte:hover .battant.g .poignee{transform:translateX(-6px)}
#entree:not(.ouvre) .porte:hover .battant.d .poignee{transform:translateX(6px)}

.aide-e{position:absolute;left:0;right:0;bottom:4vh;z-index:3;text-align:center;font-family:"Jost",system-ui,sans-serif;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:#8C7660;animation:e-pulse 2.2s ease-in-out infinite;pointer-events:none;transition:opacity .5s}
@keyframes e-pulse{50%{opacity:.35}}
#entree.ouvre .aide-e{opacity:0}

/* éclat blanc puis message */
.eclat{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:0;background:#fff;transition:opacity 1.2s ease}
#entree.blanc .eclat{opacity:1}
.bienvenue{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;text-align:center;padding:24px;pointer-events:none;opacity:0;transition:opacity 1s}
#entree.message .bienvenue{opacity:1}
.bienvenue img{width:84px;border-radius:50%}
.bienvenue .eyebrow-e{font-family:"Jost",system-ui,sans-serif;font-size:12px;letter-spacing:.4em;text-transform:uppercase;color:#AD4928}
.bienvenue h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(32px,5.4vw,62px);line-height:1.15;color:#4A372E;max-width:900px;
  filter:blur(8px);letter-spacing:.12em;transition:filter 1.6s ease,letter-spacing 2s ease}
#entree.message .bienvenue h2{filter:blur(0);letter-spacing:.02em}
#entree.fin{opacity:0;pointer-events:none}

.passer{position:absolute;top:18px;right:20px;z-index:7;background:rgba(251,247,241,.7);border:1px solid rgba(74,55,46,.3);padding:7px 14px;font-family:"Jost",system-ui,sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#7A6656;cursor:pointer;transition:.3s}
.passer:hover{background:#4A372E;color:#FBF7F1}