/* HelloIsEasy Custom CSS */

/* Fonts */
body { font-family: 'Sarabun', sans-serif; background-color: #FAFAF9; color: #1a1a2e; }
.font-inter { font-family: 'Inter', sans-serif; }
.font-sarabun { font-family: 'Sarabun', sans-serif; }

/* Custom colors */
.bg-navy { background-color: #1a1a2e; }
.bg-warm { background-color: #FAFAF9; }
.bg-gold-light { background-color: #FEF3C7; }
.text-navy { color: #1a1a2e; }
.text-line { color: #06C755; }
.text-gold { color: #F59E0B; }
.text-gold-dark { color: #92400E; }
.border-gold { border-color: #F59E0B; }

/* Custom max-width */
.max-w-landing { max-width: 640px; }

/* Sticky header shadow on scroll */
header.scrolled { box-shadow: 0 1px 3px rgba(0,0,0,0.08); }

/* CTA button effects */
.btn-line {
  background-color: #06C755;
  color: #fff;
  box-shadow: 0 2px 8px rgba(6, 199, 85, 0.3);
  transition: background-color 0.2s, transform 0.1s;
}
.btn-line:hover { background-color: #05A847; }
.btn-line:active { transform: scale(0.98); }

/* FAQ accordion */
details summary { cursor: pointer; list-style: none; }
details summary::-webkit-details-marker { display: none; }
details summary .chevron { transition: transform 0.2s; }
details[open] summary .chevron { transform: rotate(90deg); }

/* Form focus */
input:focus, select:focus, textarea:focus {
  border-color: #06C755;
  box-shadow: 0 0 0 3px rgba(6,199,85,0.1);
  outline: none;
}

/* Floating LINE button */
.floating-line {
  position: fixed;
  bottom: 24px;
  right: 24px;
  width: 56px;
  height: 56px;
  background-color: #06C755;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  z-index: 50;
  transition: transform 0.2s;
}
.floating-line:hover { transform: scale(1.05); }