.slowly-opening {
  position: relative;
  isolation: isolate;
  min-height: 100svh;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  place-items: center;
  overflow: hidden;
  color: #fff4e1;
  background: radial-gradient(ellipse at 50% 53%, #282d62 0%, #141936 40%, #0b0e25 72%, #080b1c 100%);
  scroll-margin-top: 0;
}
.slowly-opening::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(0deg,#080b1d 0%,transparent 25%,transparent 88%,#090b1b70);
}
.slowly-sky { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.slowly-sky i { position:absolute; left:var(--x); top:var(--y); width:var(--size); height:var(--size); border-radius:50%; background:#f2eafa; opacity:var(--dim); box-shadow:0 0 5px #e6ccff80; animation: slowly-twinkle var(--period) ease-in-out var(--delay) infinite alternate; }
.slowly-scene { position:relative; width:min(1140px, 100vw); aspect-ratio:1000 / 510; display:grid; place-items:center; margin-top:-8svh; }
.slowly-castle { display:block; width:100%; height:100%; overflow:visible; }
.slowly-palace { animation: slowly-castle-in 1.14s var(--ease-arrive) both; transform-origin:50% 75%; }
.slowly-comet { filter:drop-shadow(0 0 5px #c2bdff); }
.slowly-comet-line { stroke-dasharray:1; stroke-dashoffset:1; animation:slowly-trace 1.58s cubic-bezier(.35,0,.25,1) .72s forwards; }
.slowly-comet-tip { animation:slowly-comet-light 1.58s ease-in-out .72s both; }
.slowly-last-star { opacity:0; animation:slowly-in .48s ease 2.15s forwards; }
.slowly-burst { color:#d9c1ff; transform-box:fill-box; transform-origin:center; opacity:0; animation:slowly-burst 1.48s var(--ease-arrive) 1.5s both; }
.slowly-burst-two { color:#ffe4ac; animation-delay:1.95s; }
.slowly-burst-three { color:#bacbff; animation-delay:2.28s; }
.slowly-lockup { position:absolute; z-index:1; left:50%; top:65%; transform:translate(-50%,-6%); width:max-content; text-align:center; animation:slowly-logo-in .85s var(--ease-arrive) 1.63s both; }
.slowly-lockup h1 {
  font:italic 500 clamp(96px, 13vw, 163px)/.97 var(--serif);
  letter-spacing:-.018em;
  padding:0 .17em .23em;
  margin:0;
  color:#fff1df;
  background:linear-gradient(180deg,#fffdf6 17%,#ede7ff 60%,#b4b7ee 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  filter:drop-shadow(0 3px 3px #08081e) drop-shadow(0 0 19px #b3acff66);
}
.slowly-lockup p { font-size:9px; letter-spacing:.39em; color:#e8d6bd; margin:0; }
.slowly-enter {
  position:absolute;
  z-index:2;
  bottom:clamp(27px,6svh,65px);
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  min-height:44px;
  padding:8px 16px 0;
  color:#f6e7d2;
  font:600 10px var(--sans);
  letter-spacing:.22em;
  text-transform:uppercase;
  animation:slowly-in .5s ease-out .85s both;
}
.slowly-enter span { font-size:22px; line-height:1; color:#efcc93; animation:down 2s ease-in-out infinite; }
#historia { scroll-margin-top:-35px; }
.has-photo-reveal #historia .hero-image { animation:none; opacity:.85; transform:scale(1.05); transition:opacity .9s var(--ease-arrive),transform 1.35s var(--ease-arrive); }
.has-photo-reveal #historia.photo-in-view .hero-image { opacity:1; transform:scale(1); }
@keyframes slowly-castle-in { from {opacity:0;transform:translateY(12px) scale(.97)} to {opacity:1;transform:none} }
@keyframes slowly-in { from {opacity:0} to {opacity:1} }
@keyframes slowly-trace { to {stroke-dashoffset:0} }
@keyframes slowly-twinkle { to {opacity:.72;transform:scale(1.25)} }
@keyframes slowly-comet-light { 0%,100% {opacity:0} 10%,90% {opacity:1} }
@keyframes slowly-burst { 0% {opacity:0;transform:scale(.08)} 30% {opacity:.85} 100% {opacity:0;transform:scale(1.22)} }
@keyframes slowly-logo-in { from {opacity:0;transform:translate(-50%,3%) scale(.95)} to {opacity:1;transform:translate(-50%,-6%) scale(1)} }
@media(max-width:700px) {
  .slowly-scene { width: min(158vw, 830px); margin-top:-14svh; }
  .slowly-lockup { top:69%; }
  .slowly-lockup h1 { font-size:clamp(78px, 26vw, 132px); }
  .slowly-lockup p { font-size:8px; letter-spacing:.31em; }
  .slowly-enter { bottom:8svh; }
}
@media(max-height:600px) and (min-width:701px) {
  .slowly-scene { width:min(860px,85vw); margin-top:-14svh; }
  .slowly-lockup h1 {font-size:clamp(88px,12vw,126px)}
}
@media(prefers-reduced-motion:reduce) {
  .slowly-lockup, .slowly-enter, .slowly-palace, .slowly-last-star { animation:none; opacity:1; }
  .slowly-comet-line { animation:none; stroke-dashoffset:0; }
  .slowly-comet-tip, .slowly-bursts { display:none; }
}