/* ─────────────────────────────────────────────
   MFDTools Brand Stylesheet — v1.0
   Built for India's Mutual Fund Distributors
   ───────────────────────────────────────────── */

:root {
  /* ── Brand colors ── */
  --mfdt-primary: #1E40AF;          /* Electric blue (primary brand) */
  --mfdt-primary-light: #3B82F6;    /* Lighter blue (gradients, hovers) */
  --mfdt-primary-dark: #1E3A8A;     /* Darker blue (active states) */
  --mfdt-accent: #10B981;           /* Lime/mint green (accent) */
  --mfdt-accent-light: #34D399;     /* Lighter accent (gradients) */
  --mfdt-accent-dark: #059669;      /* Darker accent (active) */
  --mfdt-ink: #0F172A;              /* Deep slate (headings, ink) */
  --mfdt-text: #1E293B;             /* Body text */
  --mfdt-muted: #64748B;            /* Muted/secondary text */
  --mfdt-light: #94A3B8;            /* Lighter muted */
  --mfdt-line: #E2E8F0;             /* Borders, dividers */
  --mfdt-line-soft: #F1F5F9;        /* Soft borders */
  --mfdt-surface: #F8FAFC;          /* Section backgrounds */
  --mfdt-bg: #FFFFFF;               /* Pure white background */
  --mfdt-success: #16A34A;
  --mfdt-warn: #F59E0B;
  --mfdt-error: #DC2626;

  /* ── Typography ── */
  --mfdt-font-heading: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --mfdt-font-body: 'Inter', -apple-system, 'Segoe UI', system-ui, sans-serif;
  --mfdt-font-mono: 'JetBrains Mono', 'SF Mono', Consolas, monospace;

  /* ── Sizing ── */
  --mfdt-radius-sm: 6px;
  --mfdt-radius: 10px;
  --mfdt-radius-lg: 14px;
  --mfdt-radius-xl: 20px;

  /* ── Shadows ── */
  --mfdt-shadow-xs: 0 1px 2px rgba(15,23,42,.04);
  --mfdt-shadow-sm: 0 2px 8px rgba(15,23,42,.06);
  --mfdt-shadow: 0 4px 14px rgba(15,23,42,.08);
  --mfdt-shadow-lg: 0 12px 32px rgba(15,23,42,.12);
  --mfdt-shadow-glow: 0 0 0 4px rgba(30,64,175,.15);
  --mfdt-shadow-accent: 0 4px 14px rgba(16,185,129,.25);

  /* ── Gradients ── */
  --mfdt-gradient-brand: linear-gradient(135deg, #1E40AF 0%, #10B981 100%);
  --mfdt-gradient-primary: linear-gradient(135deg, #1E40AF 0%, #3B82F6 100%);
  --mfdt-gradient-accent: linear-gradient(135deg, #10B981 0%, #34D399 100%);
  --mfdt-gradient-dark: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);

  /* ── Spacing scale ── */
  --mfdt-space-1: 4px;
  --mfdt-space-2: 8px;
  --mfdt-space-3: 12px;
  --mfdt-space-4: 16px;
  --mfdt-space-5: 20px;
  --mfdt-space-6: 24px;
  --mfdt-space-8: 32px;
  --mfdt-space-10: 40px;
  --mfdt-space-12: 48px;
  --mfdt-space-16: 64px;
  --mfdt-space-20: 80px;

  /* ── Transitions ── */
  --mfdt-transition: all .2s cubic-bezier(.4, 0, .2, 1);
  --mfdt-transition-slow: all .35s cubic-bezier(.23, 1, .32, 1);
}

/* ── Base reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--mfdt-font-body);
  background: var(--mfdt-bg);
  color: var(--mfdt-text);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ── Headings ── */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--mfdt-font-heading);
  color: var(--mfdt-ink);
  font-weight: 800;
  letter-spacing: -0.5px;
  line-height: 1.2;
}
h1 { font-size: clamp(36px, 5vw, 56px); letter-spacing: -1px; }
h2 { font-size: clamp(28px, 4vw, 40px); }
h3 { font-size: 22px; }
h4 { font-size: 18px; }

/* ── Links ── */
a { color: var(--mfdt-primary); text-decoration: none; transition: var(--mfdt-transition); }
a:hover { color: var(--mfdt-primary-dark); }

/* ── Buttons (utility classes) ── */
.btn-primary {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 28px;
  background: var(--mfdt-gradient-brand);
  color: #fff !important;
  border: none;
  border-radius: var(--mfdt-radius-lg);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.3px;
  cursor: pointer;
  transition: var(--mfdt-transition-slow);
  box-shadow: var(--mfdt-shadow);
  font-family: inherit;
}
.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(30,64,175,.30);
}

.btn-secondary {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 28px;
  background: #fff;
  color: var(--mfdt-ink) !important;
  border: 1.5px solid var(--mfdt-line);
  border-radius: var(--mfdt-radius-lg);
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  transition: var(--mfdt-transition);
  font-family: inherit;
}
.btn-secondary:hover {
  border-color: var(--mfdt-primary);
  color: var(--mfdt-primary) !important;
}

.btn-accent {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 28px;
  background: var(--mfdt-gradient-accent);
  color: #fff !important;
  border: none;
  border-radius: var(--mfdt-radius-lg);
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  transition: var(--mfdt-transition-slow);
  box-shadow: var(--mfdt-shadow-accent);
  font-family: inherit;
}
.btn-accent:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(16,185,129,.40);
}

/* ── Cards ── */
.card {
  background: #fff;
  border: 1px solid var(--mfdt-line);
  border-radius: var(--mfdt-radius-lg);
  padding: 24px;
  box-shadow: var(--mfdt-shadow-xs);
  transition: var(--mfdt-transition);
}
.card:hover {
  border-color: var(--mfdt-primary-light);
  box-shadow: var(--mfdt-shadow);
  transform: translateY(-2px);
}

/* ── Badges ── */
.badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.badge-primary { background: rgba(30,64,175,.1); color: var(--mfdt-primary); }
.badge-accent { background: rgba(16,185,129,.1); color: var(--mfdt-accent); }
.badge-warn { background: rgba(245,158,11,.1); color: var(--mfdt-warn); }

/* ── Inputs ── */
input[type="text"], input[type="email"], input[type="number"], input[type="tel"], textarea, select {
  width: 100%;
  padding: 12px 16px;
  border: 1.5px solid var(--mfdt-line);
  border-radius: var(--mfdt-radius);
  font-size: 14px;
  font-family: inherit;
  color: var(--mfdt-ink);
  background: #fff;
  transition: var(--mfdt-transition);
}
input:focus, textarea:focus, select:focus {
  border-color: var(--mfdt-primary);
  outline: none;
  box-shadow: var(--mfdt-shadow-glow);
}

/* ── Utilities ── */
.text-primary { color: var(--mfdt-primary); }
.text-accent { color: var(--mfdt-accent); }
.text-muted { color: var(--mfdt-muted); }
.text-ink { color: var(--mfdt-ink); }
.bg-surface { background: var(--mfdt-surface); }
.bg-gradient-brand { background: var(--mfdt-gradient-brand); }

.container { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
.section { padding: 80px 0; }
.section-tight { padding: 48px 0; }

/* ── Responsive ── */
@media (max-width: 768px) {
  .section { padding: 60px 0; }
  .container { padding: 0 16px; }
}
