/* Saasable-style modern landing overrides for app index */
:root {
  --md3-primary: #2E7D32;
  --md3-primary-dark: #1B5E20;
  --md3-surface: #FFFFFF;
  --md3-surface-alt: #FAFAFA;
  --md3-border: #E0E0E0;
  --md3-text: #1A1A1A;
  --md3-text-secondary: #616161;
}

/* Remove gradient hero from base, replace with light surface */
.hero-section {
  background: var(--md3-surface-alt) !important;
  color: var(--md3-text) !important;
  padding: 96px 0 !important;
  position: relative;
  overflow: hidden;
}
.hero-section::before, .hero-section::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 70% 30%, rgba(139,195,74,0.12), transparent 70%),
              radial-gradient(circle at 20% 70%, rgba(46,125,50,0.08), transparent 60%);
  pointer-events: none;
}
.hero-section .display-4 {
  font-weight: 700 !important;
  letter-spacing: -0.5px;
  color: var(--md3-text) !important;
}
.hero-section p.lead {
  color: var(--md3-text-secondary) !important;
  font-size: 1.1rem;
}
.hero-section .btn-primary {
  background: var(--md3-primary) !important;
  border: none !important;
}
.hero-section .btn-primary:hover {
  background: var(--md3-primary-dark) !important;
}
.hero-section .btn-outline-light {
  color: var(--md3-primary) !important;
  border-color: var(--md3-primary) !important;
}
.hero-section .btn-outline-light:hover {
  background: var(--md3-primary) !important;
  color: #fff !important;
}

/* Feature cards unified styling */
#features .card, .feature-grid .card {
  border: 1px solid var(--md3-border) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  transition: box-shadow .25s, transform .25s, border-color .25s;
}
#features .card:hover, .feature-grid .card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,0.08) !important;
  transform: translateY(-4px);
  border-color: var(--md3-primary) !important;
}
.feature-icon {
  font-size: 2.4rem !important;
  color: var(--md3-primary) !important;
  opacity: .9;
}

/* Sections spacing refinement */
section.py-5 { padding-top: 72px !important; padding-bottom: 72px !important; }

/* Stats tiles */
section.py-5 .display-6.fw-bold.text-primary {
  color: var(--md3-primary) !important;
}

/* CTA section re-style */
section.bg-primary.text-white {
  background: var(--md3-primary) !important;
  position: relative;
}
section.bg-primary.text-white::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(125deg, rgba(255,255,255,0.12), rgba(255,255,255,0));
}
section.bg-primary.text-white h2 { letter-spacing: -0.5px; }
section.bg-primary.text-white .btn-light { color: var(--md3-primary-dark) !important; }
section.bg-primary.text-white .btn-outline-light { border-color:#fff !important; }

/* User Types cards */
.bg-light .card { border: 1px solid var(--md3-border) !important; box-shadow: none !important; }
.bg-light .card:hover { box-shadow: 0 6px 18px rgba(0,0,0,0.06) !important; }

/* Utility adjustments */
.gap-3 { gap: 1rem !important; }

@media (max-width: 992px) {
  .hero-section { padding: 72px 0 !important; }
  .hero-section .display-4 { font-size: 2.75rem !important; }
}
@media (max-width: 576px) {
  .hero-section { padding: 56px 0 !important; }
  .hero-section .display-4 { font-size: 2.2rem !important; }
  section.py-5 { padding-top: 56px !important; padding-bottom: 56px !important; }
}