* { box-sizing: border-box; margin: 0; padding: 0; }
html, body {
  height: 100%;
  background: #0d1117;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  font-family: 'Cormorant Garamond', 'Georgia', serif;
}
.opening-title {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(0.68rem, 1.7vw, 0.88rem);
  letter-spacing: 0.32em;
  color: #8ab4d4;
  opacity: 0;
  margin-bottom: clamp(1.6em, 4.5vw, 2.4em);
  animation: titleFade 0.9s cubic-bezier(0.4,0,0.2,1) 0.2s forwards;
  text-transform: uppercase;
}
@keyframes titleFade {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.acronym-lines {
  display: flex;
  flex-direction: column;
  gap: 0.06em;
  align-items: flex-start;
}
.acronym-line {
  display: flex;
  align-items: baseline;
  overflow: hidden;
  padding: 0.01em 0;
}
.acronym-letter-box {
  display: inline-flex;
  justify-content: center;
  width: 1.5rem;
  flex-shrink: 0;
  overflow: visible;
  margin-right: 0.3em;
}
.acronym-letter {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 600;
  font-size: clamp(1.05rem, 2.6vw, 1.35rem);
  line-height: 1.05;
  color: #c0392b;
  display: inline-block;
  transform: translateY(1.2em);
  opacity: 0;
  transition: none;
  will-change: transform, opacity;
}
.acronym-rest {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(0.82rem, 2.0vw, 1.05rem);
  color: #c8d8e8;
  letter-spacing: 0.02em;
  white-space: nowrap;
  overflow: hidden;
  opacity: 0;
}
@keyframes sheen {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}
.acronym-letter.reflect {
  background: linear-gradient(105deg,#c0392b 0%,#c0392b 35%,#ff9090 47%,#ffffff 50%,#ff9090 53%,#c0392b 65%,#c0392b 100%);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: sheen 1.1s cubic-bezier(0.4,0,0.6,1) forwards;
}
@keyframes pageExit {
  0%   { opacity: 1; transform: scale(1) translateY(0); }
  100% { opacity: 0; transform: scale(1.04) translateY(-6px); }
}
body.exiting { animation: pageExit 0.55s cubic-bezier(0.4,0,1,1) forwards; }
