/* theShoal – custom styles (Tailwind handles most; this covers gaps) */

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Nav shrink on scroll (driven by JS) */
#main-nav.scrolled { height: 64px; box-shadow: 0 4px 24px rgba(0,0,0,0.3); }

/* Hero dot-grid overlay */
.dot-grid {
  background-image: radial-gradient(circle at 1px 1px, rgba(212,255,0,0.15) 1px, transparent 0);
  background-size: 40px 40px;
}

/* Accordion */
.accordion-content { max-height: 0; overflow: hidden; transition: max-height 0.35s ease, padding 0.25s ease; }
.accordion-content.open { max-height: 600px; }
.accordion-icon { transition: transform 0.3s ease; }
.accordion-btn.open .accordion-icon { transform: rotate(45deg); }

/* Tab buttons */
.tab-btn { border-bottom: 2px solid transparent; transition: color 0.2s, border-color 0.2s; }
.tab-btn.active { color: #BFDF00; border-color: #BFDF00; }

/* Prose-style content in long-form pages */
.prose-shoal h2 { font-size: 1.5rem; font-weight: 700; color: #1a1d10; margin-top: 2.5rem; margin-bottom: 0.75rem; }
.prose-shoal h3 { font-size: 1.125rem; font-weight: 600; color: #1a1d10; margin-top: 1.75rem; margin-bottom: 0.5rem; }
.prose-shoal p  { color: #475569; line-height: 1.75; margin-bottom: 1rem; }
.prose-shoal ul { list-style: disc; padding-left: 1.5rem; color: #475569; margin-bottom: 1rem; }
.prose-shoal ul li { margin-bottom: 0.375rem; }
.prose-shoal a  { color: #536600; text-decoration: underline; }
.prose-shoal a:hover { color: #BFDF00; }

/* Step numbers */
.step-num {
  width: 36px; height: 36px; min-width: 36px;
  background: #BFDF00; color: #051426;
  font-weight: 800; font-size: 0.875rem;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
}

/* Feature card hover */
.feature-card { transition: border-color 0.25s, box-shadow 0.25s; }
.feature-card:hover { border-color: #BFDF00; box-shadow: 0 8px 32px rgba(191,223,0,0.08); }

/* Hero gradient background */
.hero-bg {
  background: linear-gradient(135deg, #051426 0%, #071d3a 40%, #051426 100%);
  will-change: auto;
}

/* Scroll hint — opacity pulse only (no transform, so no scroll jank) */
@keyframes pulse-opacity {
  0%, 100% { opacity: 0.4; }
  50%       { opacity: 0.15; }
}
.scroll-hint {
  animation: pulse-opacity 2s ease-in-out infinite;
}

/* Contact form */
.form-input {
  background: #fff; border: 1px solid #c5c9ac;
  padding: 0.75rem 1rem; width: 100%;
  font-family: inherit; font-size: 0.9375rem; color: #1a1d10;
  border-radius: 0.125rem; outline: none; transition: border-color 0.2s;
}
.form-input:focus { border-color: #BFDF00; }
.form-label { display: block; font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.04em; color: #1a1d10; margin-bottom: 0.375rem; text-transform: uppercase; }
