/* ============================================================
   Lottofy Design System overlay for the Partners replica.
   Applies brand typography (Noto Sans JP headings) and remaps
   the site's near-brand colors to exact Lottofy tokens.
   ============================================================ */

@font-face {
  font-family: 'Noto Sans JP';
  src: url('fonts/NotoSansJP-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --green-50:  #F3FAF7;
  --green-500: #3CA57F;
  --green-900: #014737;
  --green-950: #002A1F;
  --lime-300:  #D6E869;
  --gray-300:  #D1D5DB;
  --gray-600:  #4B5563;
  --gray-900:  #111827;
}

/* --- Typography: headings use Noto Sans JP 700 per Lottofy DS --- */
h1, h2, h3, h4, h5, h6,
.hero-title, .blog-post-title {
  font-family: 'Noto Sans JP', 'Inter', system-ui, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em;
}

/* Numeric callouts stay on Inter (tabular figures) per DS rule */
.num-display, .jackpot-amount, .lotto-ball {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-variant-numeric: tabular-nums;
}

/* Eyebrows / uppercase pill labels keep brand tracking */
[class*="eyebrow"], [class*="pill"], .badge, [class*="tag-"] {
  letter-spacing: 0.12em;
}

/* --- Active nav link: small green-500 underline --- */
.nav-link { position: relative; }
.nav-link.w--current::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -3px;
  transform: translateX(-50%);
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background-color: #3CA57F;   /* green-500 */
}

/* --- Form fields: typed text uses DS foreground (gray-900) --- */
input:not([type="submit"]):not([type="button"]), textarea, select,
.w-input, .w-select, .text-field, [class*="text-field"], [class*="form-input"] {
  color: #111827 !important;          /* gray-900 foreground */
  font-family: 'Inter', system-ui, sans-serif !important;
}

/* --- Submit button: white label + paper-plane send icon (left) --- */
.lottofy-send-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: #FFFFFF !important;          /* white label */
  font-family: 'Inter', system-ui, sans-serif !important;
  cursor: pointer;
}
.lottofy-send-btn .btn-send-icon {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  stroke: currentColor;
}
input::placeholder, textarea::placeholder, .w-input::placeholder {
  color: #6B7280 !important;          /* gray-500 muted-foreground */
  opacity: 1;
}