/* ============================================================
   EVENTUALLY EVENTS — entrance.css
   The cinematic overture: ink curtain + gold seal that draws
   itself in, tagline resolve, then the curtain lifts.
   "Beauty and perception is key."
   ============================================================ */

#entrance{
  position:fixed;inset:0;z-index:9999;
  display:flex;align-items:center;justify-content:center;
  background:
    radial-gradient(120% 120% at 50% 40%,#1c160d 0%,#0f0c08 55%,#080604 100%);
  overflow:hidden;
  transition:opacity 1s ease,visibility 1s ease;
}
/* faint gold vignette breathing behind the seal */
#entrance::before{
  content:"";position:absolute;width:80vmin;height:80vmin;border-radius:50%;
  background:radial-gradient(circle,rgba(199,162,78,.14),rgba(199,162,78,0) 62%);
  filter:blur(6px);animation:entGlow 3.4s ease-in-out infinite;
}
@keyframes entGlow{0%,100%{opacity:.5;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}

.entrance-inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center}

.entrance-seal{width:min(58vmin,420px);height:auto;overflow:visible}

/* rings draw themselves */
.ent-ring{stroke-linecap:round}
.ent-ring-o{stroke-dasharray:1244;stroke-dashoffset:1244;animation:entDraw 1.7s var(--ease,cubic-bezier(.22,.61,.36,1)) .15s forwards}
.ent-ring-i{stroke-dasharray:1144;stroke-dashoffset:1144;animation:entDraw 1.7s var(--ease,cubic-bezier(.22,.61,.36,1)) .35s forwards}
@keyframes entDraw{to{stroke-dashoffset:0}}

/* arc lettering + E fade up */
.ent-arc{opacity:0;animation:entFade 1.1s ease .95s forwards}
.ent-E{opacity:0;transform-origin:center;animation:entE 1.4s var(--ease,cubic-bezier(.22,.61,.36,1)) .55s forwards}
@keyframes entFade{to{opacity:1}}
@keyframes entE{0%{opacity:0;transform:scale(.82)}100%{opacity:1;transform:scale(1)}}

/* gold shimmer sweeps across the seal once */
.entrance-seal::after{content:""}
.entrance-inner::after{
  content:"";position:absolute;top:0;left:-30%;width:40%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,244,206,.35),transparent);
  transform:skewX(-18deg);filter:blur(3px);
  animation:entShimmer 1.5s ease 1.35s 1;opacity:0;pointer-events:none;
}
@keyframes entShimmer{0%{left:-30%;opacity:0}20%{opacity:1}80%{opacity:1}100%{left:120%;opacity:0}}

.entrance-tag{
  margin-top:26px;font-family:'Cormorant Garamond',serif;font-style:italic;
  font-weight:500;font-size:clamp(20px,3.4vw,30px);letter-spacing:.02em;
  background:linear-gradient(122deg,#BD9440,#EFDCA0 55%,#B58C37);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  opacity:0;transform:translateY(10px);
  animation:entTag 1.2s var(--ease,cubic-bezier(.22,.61,.36,1)) 1.55s forwards;
}
@keyframes entTag{to{opacity:1;transform:none}}

/* thin gold rule under the tagline */
.entrance-tag::after{
  content:"";display:block;height:1px;width:0;margin:16px auto 0;
  background:linear-gradient(90deg,transparent,#C6A04E,transparent);
  animation:entRule 1s ease 2s forwards;
}
@keyframes entRule{to{width:200px}}

/* dismissal */
#entrance.lift{opacity:0;visibility:hidden}
#entrance.lift .entrance-inner{transform:translateY(-14px) scale(.985);transition:transform 1s var(--ease,cubic-bezier(.22,.61,.36,1))}

/* returning visitor / reduced motion: no overture */
#entrance.skip{display:none}
@media (prefers-reduced-motion:reduce){
  #entrance{display:none}
}

/* safety net: if JS never dismisses it (error/disabled), fade away anyway */
#entrance{animation:entSafety .8s ease 5s forwards}
@keyframes entSafety{to{opacity:0;visibility:hidden;pointer-events:none}}