.welcome {
  isolation: isolate;
  background: radial-gradient(ellipse at 66% 70%, #24516c77, transparent 64%), #07283f;
}
.welcome::before, .attract-lines {
  content: '';
  position: absolute;
  inset: -18%;
  pointer-events: none;
  background: url('assets/strata.svg') center / cover no-repeat;
  opacity: .55;
  animation: strata-flow 30s ease-in-out infinite alternate;
}
.welcome::before { z-index: 0; }
.welcome-top { animation: title-reveal .85s cubic-bezier(.2,.7,.2,1) both; }
.welcome h1 { text-shadow: 0 6px 36px #04182755; }
.mineral-scene { z-index: 1; perspective: 1000px; }
.mineral {
  position: relative;
  z-index: 2;
  filter: drop-shadow(0 24px 22px #010b1733);
  animation: crystal-float 11s ease-in-out infinite;
}
.mineral-halo {
  inset: 18% 9% 3%;
  border-radius: 50%;
  background: radial-gradient(ellipse at 48% 46%, #9dd9ed17, transparent 60%), radial-gradient(ellipse at 73% 63%, #e4ad6217, transparent 38%);
  animation: light-breathe 9s ease-in-out infinite;
}
.mineral-orbit {
  position: absolute;
  width: 78%;
  aspect-ratio: 1;
  left: 11%;
  bottom: -13%;
  border: 1px solid #a9d8e333;
  border-radius: 50%;
  transform: rotateX(68deg) rotateZ(-22deg);
  animation: orbit-turn 28s linear infinite;
}
.mineral-orbit::after {
  content: '';
  position: absolute;
  width: 6px;
  height: 6px;
  background: #d5e7ee;
  border-radius: 50%;
  left: 50%;
  top: -3px;
  box-shadow: 0 0 14px #b5e0ed66;
}
.orbit-two {
  width: 92%;
  left: 4%;
  bottom: -20%;
  border-color: #edba7330;
  border-left-color: transparent;
  animation-duration: 36s;
  animation-direction: reverse;
}
.orbit-two::after { background: var(--gold); width: 4px; height: 4px; }
.orbit-three { width: 62%; left: 19%; bottom: -4%; border-style: dashed; border-color: #a9d8e322; animation-duration: 45s; }
.orbit-three::after { display: none; }
.home-content { background: linear-gradient(130deg, #12384e44, transparent 65%); }
.ticket-preview { animation: item-reveal .7s .08s cubic-bezier(.2,.7,.2,1) both; box-shadow: 0 12px 40px #0317251a; }
.ticket-cta { position: relative; overflow: hidden; isolation: isolate; }
.ticket-cta::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 -45%;
  width: 35%;
  z-index: -1;
  background: linear-gradient(100deg, transparent, #fff5, transparent);
  transform: skewX(-22deg);
  animation: ticket-light 9s ease-in-out infinite;
}
.ticket-cta > .icon { transition: transform .25s; }
.ticket-cta:hover > .icon, .ticket-cta:active > .icon { transform: translateX(5px); }
.home-menu-link {
  position: relative;
  padding-inline: 10px;
  margin-inline: -10px;
  overflow: hidden;
  animation: item-reveal .65s .16s cubic-bezier(.2,.7,.2,1) both;
  transition: background .25s, border-color .25s;
}
.home-menu-link:nth-child(2) { animation-delay: .25s; }
.home-menu-link:nth-child(3) { animation-delay: .34s; }
.home-menu-link:nth-child(4) { animation-delay: .43s; }
.home-menu-link::before {
  content: '';
  position: absolute;
  inset: 22% auto 22% 0;
  width: 2px;
  background: var(--gold);
  transform: scaleY(0);
  transition: transform .25s;
}
.menu-icon .icon, .menu-arrow { transition: transform .3s cubic-bezier(.2,.7,.2,1), color .3s; }
.home-menu-link:is(:hover,:active,:focus-visible) { background: #c5e2ed08; border-color: #c5e2ed38; }
.home-menu-link:is(:hover,:active,:focus-visible)::before { transform: scaleY(1); }
.home-menu-link:is(:hover,:active,:focus-visible) .menu-icon .icon { transform: translateY(-3px) rotate(-7deg); }
.home-menu-link:is(:hover,:active,:focus-visible) .menu-arrow { transform: translateX(5px); color: var(--gold); }
.energy-banner { position: relative; isolation: isolate; animation: item-reveal .7s .52s cubic-bezier(.2,.7,.2,1) both; }
.energy-banner::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: -180% -10% -180% 45%;
  background: url('assets/strata.svg') center / contain;
  opacity: .35;
  transform: rotate(-20deg);
  transition: transform .6s;
}
.energy-banner:is(:hover,:active) { border-color: #edba7377; }
.energy-banner:is(:hover,:active)::before { transform: rotate(-10deg) scale(1.1); }
.energy-mark .icon { animation: crystal-float 9s ease-in-out infinite; }
.page-heading { animation: title-reveal .5s cubic-bezier(.2,.7,.2,1) both; }
.page-body > .documents-list, .poster-grid, .feedback-grid, .hours-display, .energy-page { animation: item-reveal .55s .07s cubic-bezier(.2,.7,.2,1) both; }
.document-link > .icon:last-child, .poster-link > .icon, .side-links a .icon { transition: transform .25s, color .25s; }
.document-link:is(:hover,:active) > .icon:last-child, .poster-link:is(:hover,:active) > .icon { transform: translateX(5px); color: var(--gold); }
.side-links a:is(:hover,:active) .icon { transform: translateY(-2px); color: var(--gold); }
.poster-thumb, .feedback-art { transition: box-shadow .3s; }
.poster-link:is(:hover,:active) .poster-thumb, .feedback-option:is(:hover,:active) .feedback-art { box-shadow: 0 0 0 2px var(--gold); }
.attract-content { animation: title-reveal .9s cubic-bezier(.2,.7,.2,1) both; }
.attract h1 { font-size: clamp(44px, 5.6vw, 86px); }
.attract::after { animation: crystal-float 12s ease-in-out infinite; }
@keyframes title-reveal { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes item-reveal { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
@keyframes crystal-float {
  0%,100% { transform: translate3d(0,0,0) rotate(-1deg); }
  35% { transform: translate3d(4px,-12px,0) rotate(.8deg); }
  70% { transform: translate3d(-3px,-5px,0) rotate(-.4deg); }
}
@keyframes orbit-turn { from { transform: rotateX(68deg) rotateZ(-22deg); } to { transform: rotateX(68deg) rotateZ(338deg); } }
@keyframes strata-flow { from { transform: translate3d(-1%,-2%,0) rotate(-3deg) scale(1); } to { transform: translate3d(3%,2%,0) rotate(3deg) scale(1.06); } }
@keyframes light-breathe { 0%,100% { opacity: .55; transform: scale(.94); } 50% { opacity: 1; transform: scale(1.05); } }
@keyframes ticket-light { 0%,55% { left: -45%; } 75%,100% { left: 140%; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media (max-height: 850px) and (min-width: 621px) {
  html[data-layout=landscape] .home-content { padding-top: 24px; padding-bottom: 20px; gap: 12px; }
  html[data-layout=landscape] .home-menu-link { min-height: 72px; padding-block: 11px; }
  html[data-layout=landscape] .ticket-prices { margin-block: 14px; }
  html[data-layout=landscape] .energy-banner { min-height: 76px; }
}
