
html { scroll-behavior: smooth; }
* { box-sizing: border-box; }
img { max-width: 100%; }

/* The original Claude Design export used a non-standard style-hover attribute.
   app.js applies those declarations on pointer hover and restores the inline styles. */

@keyframes pulseGlow {
  0%, 100% { transform: scale(0.96); opacity: 0.6; }
  50% { transform: scale(1.08); opacity: 1; }
}

.demo-modal {
  width: min(560px, calc(100vw - 32px));
  border: 0;
  border-radius: 24px;
  padding: 0;
  color: oklch(24% 0.02 260);
  box-shadow: 0 30px 90px rgb(0 0 0 / 0.28);
}
.demo-modal::backdrop {
  background: rgb(9 15 27 / 0.64);
  backdrop-filter: blur(6px);
}
.demo-form {
  position: relative;
  display: grid;
  gap: 16px;
  padding: 34px;
  font-family: 'Manrope', sans-serif;
  background: oklch(98% 0.01 85);
}
.demo-form h2 {
  margin: 0;
  font-family: 'Baloo 2', sans-serif;
  font-size: 30px;
  line-height: 1.15;
}
.demo-form p { margin: -6px 0 4px; line-height: 1.6; color: oklch(43% 0.02 260); }
.demo-form__eyebrow { font-size: 12px; font-weight: 800; color: oklch(55% 0.13 35); }
.demo-form label { display: grid; gap: 7px; font-size: 13px; font-weight: 700; }
.demo-form input,
.demo-form textarea {
  width: 100%;
  border: 1px solid oklch(85% 0.01 260);
  border-radius: 12px;
  padding: 12px 13px;
  font: inherit;
  background: white;
  color: inherit;
  outline: none;
}
.demo-form input:focus,
.demo-form textarea:focus {
  border-color: oklch(70% 0.12 200);
  box-shadow: 0 0 0 4px oklch(78% 0.10 200 / 0.18);
}
.demo-modal__close {
  position: absolute;
  right: 18px;
  top: 14px;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 30px;
  cursor: pointer;
}
.demo-form__submit {
  border: 0;
  border-radius: 999px;
  padding: 14px 20px;
  background: oklch(24% 0.02 260);
  color: white;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
