#scroll-progress {
  transition: transform 0.1s linear;
}

#mobile-nav {
  background-color: #fff;
  overflow-y: auto;
  padding-bottom: 20px;
}

#mobile-nav-overlay {
  background-color: rgba(0, 0, 0, 0.8);
}

#mobile-nav a {
  text-decoration: none;
}

#mobile-menu-toggle {
  position: relative;
}

#mobile-menu-toggle .icon-menu-close {
  display: none;
}

#mobile-menu-toggle[data-state="open"] .icon-menu-open {
  display: none;
}

#mobile-menu-toggle[data-state="open"] .icon-menu-close {
  display: block;
}

.form-message {
  margin-top: 1rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--foreground);
  font-size: 0.75rem;
  line-height: 1.5;
}

.checkbox-check-icon {
  opacity: 0;
  transition: opacity 0.15s ease;
}

button[data-state="checked"] .checkbox-check-icon {
  opacity: 1;
}


html.js [data-reveal] {
  transition-property: opacity, transform, filter, height;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  transition-duration: 0.7s;
  transition-delay: calc(var(--reveal-index, 0) * 60ms);
  will-change: opacity, transform;
}

html.js [data-reveal="up"] {
  opacity: 0;
  transform: translateY(40px);
}

html.js [data-reveal="up-sm"] {
  opacity: 0;
  transform: translateY(14px);
}

html.js [data-reveal="up-blur"] {
  opacity: 0;
  transform: translateY(12px);
  filter: blur(6px);
}

html.js [data-reveal="left"] {
  opacity: 0;
  transform: translateX(30px);
}

html.js [data-reveal="word"] {
  opacity: 0;
  transform: translateY(60%);
  filter: blur(10px);
  transition-duration: 0.55s;
}

html.js [data-reveal="word-plain"] {
  opacity: 0;
  transform: translateY(60%);
  transition-duration: 0.55s;
}

html.js [data-reveal="word-soft"] {
  opacity: 0.18;
  filter: blur(4px);
  transition-duration: 0.5s;
}

html.js [data-reveal="underline"] {
  transform: scaleX(0);
  transition-property: transform;
  transition-duration: 0.6s;
  transition-delay: 0.15s;
}

html.js [data-reveal="vline"] {
  transform: scaleY(0);
  transition-property: transform;
  transition-duration: 0.9s;
}

html.js [data-reveal="rail"] {
  height: 0%;
  transition-property: height;
  transition-duration: 1.1s;
}

html.js [data-reveal].is-visible {
  opacity: 1;
  transform: none;
  filter: none;
}

html.js [data-reveal="underline"].is-visible {
  transform: scaleX(1);
}

html.js [data-reveal="vline"].is-visible {
  transform: scaleY(1);
}

html.js [data-reveal="rail"].is-visible {
  height: 100%;
}

@media (prefers-reduced-motion: reduce) {
  html.js [data-reveal] {
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    height: auto !important;
  }
}