/* A slow, moonlit reveal. The entire scene is decorative; the greeting stays readable. */
.shw-reveal {
  background: #08060e;
  opacity: 1;
  padding: 30px;
  transition: opacity 1.1s cubic-bezier(.35,0,.35,1);
}
.shw-reveal::backdrop { background: transparent; backdrop-filter: none; }
.shw-reveal::before {
  inset: 0;
  z-index: 0;
  transform: none;
  animation: none;
  background: radial-gradient(ellipse at 50% 38%, #61306a52, transparent 62%), linear-gradient(180deg, #0b0714, #1a1027 65%, #090810);
}
.shw-reveal::after {
  inset: 0;
  z-index: 2;
  border: 0;
  border-radius: 0;
  background: radial-gradient(ellipse at 50% 45%, transparent 25%, #06040c85 100%);
}
.shw-reveal[data-phase='leaving'] { opacity: 0; }
.shw-reveal-brand {
  position: absolute;
  z-index: 4;
  top: 35px;
  left: 42px;
  display: flex;
  align-items: center;
  gap: 13px;
  margin: 0;
  color: #f7f0fc;
  font: 850 23px/1.1 var(--svs-body, Arial, sans-serif);
  letter-spacing: -.06em;
}
.shw-reveal-brand span { color: #ceb6dd; font-size: 10px; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; }
.shw-reveal-close, .shw-reveal-sound {
  position: absolute;
  z-index: 5;
  top: 25px;
  min-height: 44px;
  padding: 11px 17px;
  border: 1px solid #dfc6ef38;
  border-radius: 999px;
  background: #1b1227cc;
  color: #f6eafa;
  font: 600 12px/1.3 var(--svs-body, Arial, sans-serif);
  letter-spacing: 0;
  cursor: pointer;
}
.shw-reveal-close { right: 30px; }
.shw-reveal-sound { right: 188px; }
.shw-reveal-close:hover, .shw-reveal-sound:hover { background: #3b2752; }
.shw-reveal-sound:focus-visible { outline: 2px solid #dbf7b2; outline-offset: 4px; }
.shw-night-scene { position: absolute; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; }
.shw-night-moon {
  position: absolute;
  top: 13%;
  left: 73%;
  width: clamp(150px, 20vw, 280px);
  aspect-ratio: 1;
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%, 45px) scale(.92);
  background: radial-gradient(ellipse at 30% 22%, #715f8030 0 8%, transparent 9%), radial-gradient(ellipse at 71% 37%, #8a70851f 0 13%, transparent 14%), radial-gradient(ellipse at 34% 63%, #85728d3a 0 18%, transparent 19%), radial-gradient(ellipse at 57% 75%, #c2b1b344 0 8%, transparent 9%), radial-gradient(circle at 38% 30%, #fff9dc, #ded8ba 58%, #a89eac 100%);
  box-shadow: 0 0 65px #d5bcf52d, 0 0 150px #c5a3e51a, inset -15px -12px 30px #64497861;
  transition: opacity 1.6s ease, transform 2.3s cubic-bezier(.2,.65,.25,1);
}
.shw-reveal:is([data-phase='awakening'],[data-phase='greeting'],[data-phase='leaving']) .shw-night-moon { opacity: .72; transform: translate(-50%, 0) scale(1); }
.shw-night-halo { position: absolute; inset: 8% 5% 3%; opacity: 0; background: radial-gradient(ellipse at 50% 43%, #b684db20, transparent 56%); transition: opacity 1.5s ease; }
.shw-reveal:is([data-phase='greeting'],[data-phase='leaving']) .shw-night-halo { opacity: 1; }
.shw-night-fog { position: absolute; left: -20%; width: 140%; height: 50%; filter: blur(30px); opacity: .6; background: radial-gradient(ellipse at 20% 60%, #b5a0d338, transparent 40%), radial-gradient(ellipse at 73% 48%, #d0c8b42b, transparent 42%); }
.shw-night-fog-back { top: 25%; animation: shw-night-drift 9s ease-out both; }
.shw-night-fog-front { bottom: -18%; z-index: 3; opacity: .85; animation: shw-night-drift 10s ease-out reverse both; }
@keyframes shw-night-drift { from { transform: translateX(-8%); } to { transform: translateX(8%); } }
.shw-night-trees { position: absolute; inset: 0; opacity: .95; }
.shw-night-trees::after { content: ''; position: absolute; left: -15%; right: -15%; bottom: -18%; height: 44%; border-radius: 50%; background: #05060b; }
.shw-night-trees > span { position: absolute; bottom: 12%; left: 0; width: 8%; height: 34%; transform-origin: center bottom; background: #06060c; clip-path: polygon(48% 0, 70% 24%, 59% 22%, 88% 52%, 69% 47%, 100% 82%, 56% 76%, 56% 100%, 44% 100%, 44% 76%, 0 82%, 31% 47%, 12% 52%, 41% 22%, 30% 24%); }
.shw-night-trees > span:nth-child(2) { left: 4%; height: 46%; width: 12%; bottom: 9%; }
.shw-night-trees > span:nth-child(3) { left: 13%; height: 30%; width: 9%; bottom: 10%; }
.shw-night-trees > span:nth-child(4) { left: 21%; height: 23%; width: 8%; bottom: 8%; }
.shw-night-trees > span:nth-child(5) { left: 29%; height: 17%; width: 7%; bottom: 6%; }
.shw-night-trees > span:nth-child(6) { left: 39%; height: 12%; width: 6%; bottom: 6%; }
.shw-night-trees > span:nth-child(7) { left: 59%; height: 16%; width: 7%; bottom: 5%; }
.shw-night-trees > span:nth-child(8) { left: 68%; height: 22%; width: 8%; bottom: 8%; }
.shw-night-trees > span:nth-child(9) { left: 77%; height: 33%; width: 10%; bottom: 9%; }
.shw-night-trees > span:nth-child(10) { left: 85%; height: 49%; width: 13%; bottom: 7%; }
.shw-night-trees > span:nth-child(11) { left: 95%; height: 35%; width: 10%; bottom: 11%; }
.shw-night-eyes { position: absolute; left: 50%; top: 46%; display: flex; gap: 32px; transform: translate(-50%, -50%); opacity: 0; transition: opacity .65s ease, transform 1.5s ease; }
.shw-night-eyes i { display: block; width: 32px; height: 12px; border-radius: 80% 10% 80% 10%; background: #d5ef9f; box-shadow: 0 0 20px #c7f58a60, 0 0 60px #a9d77b40; transform: rotate(15deg); }
.shw-night-eyes i + i { transform: scaleX(-1) rotate(15deg); }
.shw-reveal[data-phase='opening'] .shw-night-eyes { animation: shw-night-watch .85s ease both; }
.shw-reveal[data-phase='awakening'] .shw-night-eyes { opacity: .55; transform: translate(-50%, -50%) scale(.9); }
@keyframes shw-night-watch { from { opacity: 0; transform: translate(-50%, -50%) scale(.8); } to { opacity: .85; transform: translate(-50%, -50%) scale(1); } }
.shw-reveal-inner { position: relative; z-index: 3; width: 100%; max-width: 1100px; margin: 7vh auto 0; opacity: 0; transform: translateY(18px); transition: opacity .9s ease, transform 1.15s cubic-bezier(.2,.75,.3,1); }
.shw-reveal:is([data-phase='greeting'],[data-phase='leaving']) .shw-reveal-inner { opacity: 1; transform: none; filter: none; }
body.sonder-vibe-site .shw-reveal .shw-reveal-title,
.shw-reveal[data-phase='greeting'] .shw-reveal-title {
  margin: 0;
  max-width: none;
  color: #fff9ec;
  font: normal 800 clamp(62px, 9vw, 136px)/.98 var(--svs-body, Arial, sans-serif) !important;
  letter-spacing: -.045em;
  text-wrap: balance;
  text-shadow: 0 4px 48px #07050ff2;
  animation: none;
  opacity: 1;
  transform: none;
  filter: none;
}
body.sonder-vibe-site .shw-reveal .shw-reveal-title em { display: block; margin-top: 6px; color: #ffc48a; font: inherit !important; letter-spacing: inherit; }
.shw-reveal-label { display: inline-flex; margin: 0 0 22px; padding: 8px 14px; border: 1px solid #dfc6ef26; border-radius: 999px; background: #100a1bcf; color: #e1f3c6; font: 650 12px/1.5 var(--svs-body, Arial, sans-serif); letter-spacing: .18em; text-transform: uppercase; }
.shw-reveal-caption { margin: 26px 0 0; color: #e2d5ec; font: 500 17px/1.5 var(--svs-body, Arial, sans-serif); letter-spacing: 0; }
@media (max-width: 700px) {
  .shw-reveal { padding: 22px; }
  .shw-reveal-brand { top: 25px; left: 22px; font-size: 21px; }
  .shw-reveal-brand span { display: none; }
  .shw-reveal-close, .shw-reveal-sound { top: 16px; font-size: 10px; padding: 10px 12px; }
  .shw-reveal-close { right: 16px; }
  .shw-reveal-sound { right: 143px; }
  .shw-night-moon { top: 17%; left: 50%; width: 145px; }
  .shw-night-eyes { top: 43%; }
  .shw-reveal-inner { margin-top: 10vh; }
  body.sonder-vibe-site .shw-reveal .shw-reveal-title { font-size: clamp(43px, 10.4vw, 73px) !important; line-height: 1.04; letter-spacing: -.035em; }
  .shw-reveal-label { margin-bottom: 20px; font-size: 10px; letter-spacing: .13em; }
  .shw-reveal-caption { max-width: 260px; margin: 22px auto 0; font-size: 15px; }
  .shw-night-trees > span { bottom: 7%; }
}
@media (max-width: 360px) {
  .shw-reveal-brand { left: 16px; font-size: 18px; }
  .shw-reveal-close { right: 12px; padding-inline: 9px; }
  .shw-reveal-sound { right: 129px; padding-inline: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .shw-reveal, .shw-reveal *, .shw-reveal::before, .shw-reveal::after { animation: none !important; transition: none !important; }
}
body:is(.motion-paused,.reduced-motion,.svs-motion-paused) .shw-reveal *,
html[data-motion='paused'] .shw-reveal * { animation: none !important; transition: none !important; }