/* Nukiyo — small layer of custom styles on top of Tailwind CDN. */

/* Hide Alpine elements until initialized to prevent flash of unstyled content. */
[x-cloak] {
  display: none !important;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Smooth anchor scrolling offset so sticky header doesn't cover targets. */
:target {
  scroll-margin-top: 6rem;
}

/* Form fields: force readable text even inside dark/coloured hero sections. */
input:not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]),
select,
textarea {
  color: #111827;
  background-color: #ffffff;
  color-scheme: light;
}

input::placeholder,
textarea::placeholder {
  color: #9ca3af;
  opacity: 1;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
select:-webkit-autofill,
textarea:-webkit-autofill {
  -webkit-text-fill-color: #111827 !important;
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
  box-shadow: 0 0 0 1000px #ffffff inset !important;
}

select option {
  color: #111827;
  background-color: #ffffff;
}

/* Subtle hero gradient mesh used on landing/home heroes. */
.hero-mesh {
  background-color: #06241c;
  background-image:
    radial-gradient(at 18% 12%, rgba(35, 149, 110, 0.55) 0px, transparent 50%),
    radial-gradient(at 82% 8%, rgba(70, 176, 136, 0.35) 0px, transparent 45%),
    radial-gradient(at 75% 85%, rgba(17, 96, 73, 0.55) 0px, transparent 50%);
}

/* Accordion answer transition. */
details > summary {
  list-style: none;
  cursor: pointer;
}
details > summary::-webkit-details-marker {
  display: none;
}