/* PayFyre Mobile Responsive — clean rewrite v15 */

/* === NAV === */
#pfWord { color: #fff !important; }
#pfNav.scrolled #pfWord,
#pfNav.solid #pfWord { color: #16161f !important; }
#pfNav.menuopen:not(.scrolled) #pfWord { color: #fff !important; }
#pfNav.menuopen.scrolled #pfWord { color: #16161f !important; }

#pfBurger { color: #fff !important; }
#pfNav.scrolled #pfBurger,
#pfNav.solid #pfBurger { color: #16161f !important; background: transparent !important; }
#pfNav.menuopen:not(.scrolled) #pfBurger { color: #fff !important; background: rgba(255,255,255,.1) !important; }
#pfNav.menuopen.scrolled #pfBurger { color: #16161f !important; background: transparent !important; }

#pfPanel a.nav-mlink {
  display: block !important;
  padding: 13px 14px !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #e7e9ee !important;
  background: transparent !important;
}
#pfPanel a.nav-mlink[data-active="true"] {
  color: #00E556 !important;
  background: rgba(0,229,86,.12) !important;
}

/* === TABLET & MOBILE === */
@media (max-width: 960px) {
  [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns: repeat(4"] {
    grid-template-columns: 1fr 1fr !important;
  }
}

@media (max-width: 768px) {
  /* Grids → single column */
  [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Hero → stack, reduce height */
  [style*="min-height: 100vh"],
  [style*="min-height:100vh"] {
    min-height: auto !important;
    padding-top: 100px !important;
    padding-bottom: 40px !important;
  }

  /* Large headings → smaller */
  [style*="font-size: 48px"], [style*="font-size:48px"] { font-size: 30px !important; }
  [style*="font-size: 44px"], [style*="font-size:44px"] { font-size: 30px !important; }
  [style*="font-size: 42px"], [style*="font-size:42px"] { font-size: 28px !important; }
  [style*="font-size: 40px"], [style*="font-size:40px"] { font-size: 28px !important; }
  [style*="font-size: 38px"], [style*="font-size:38px"] { font-size: 26px !important; }
  [style*="font-size: 36px"], [style*="font-size:36px"] { font-size: 26px !important; }
  [style*="font-size: 32px"], [style*="font-size:32px"] { font-size: 24px !important; }
  [style*="font-size: 28px"], [style*="font-size:28px"] { font-size: 22px !important; }
  [style*="font-size: 27px"], [style*="font-size:27px"] { font-size: 21px !important; }

  /* Fixed widths → full */
  [style*="max-width: 1240px"], [style*="max-width:1240px"],
  [style*="max-width: 1200px"], [style*="max-width:1200px"],
  [style*="max-width: 1100px"], [style*="max-width:1100px"] {
    max-width: 100% !important;
  }

  /* Padding reductions */
  [style*="padding: 64px"], [style*="padding:64px"] { padding: 32px 20px !important; }
  [style*="padding: 48px"], [style*="padding:48px"] { padding: 28px 20px !important; }
  [style*="padding: 36px"], [style*="padding:36px"] { padding: 24px 18px !important; }
  [style*="padding: 32px"], [style*="padding:32px"] { padding: 24px 18px !important; }

  /* Gap reductions */
  [style*="gap: 40px"], [style*="gap:40px"] { gap: 20px !important; }
  [style*="gap: 32px"], [style*="gap:32px"] { gap: 16px !important; }

  /* Scrolly → static on mobile */
  #scrolly { height: auto !important; }
  #scrolly > div {
    position: static !important;
    height: auto !important;
    padding: 32px 0 !important;
  }

  /* Secured by design card */
  [style*="grid-auto-rows:236px"], [style*="grid-auto-rows: 236px"] {
    grid-auto-rows: auto !important;
  }
  [style*="grid-column:span 3"] {
    grid-column: 1 / -1 !important;
    height: auto !important;
    min-height: unset !important;
    overflow: visible !important;
    padding: 32px 24px !important;
  }
  [style*="grid-column:span 3"][style*="display:flex"] {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  [style*="grid-column:span 3"][style*="display:flex"] > div {
    max-width: 100% !important;
    padding: 8px 0 !important;
  }

  /* Hero buttons → full width */
  section a[href="/login"],
  section a[href="/merchants"],
  section a[href="/pricing"],
  section a[href="/merchant-onboarding"] {
    width: 100% !important;
    justify-content: center !important;
    padding: 0 20px !important;
  }

  /* Download app buttons → full width */
  a[href="/login"][style*="background:#0b3d1d"],
  a[href="/login"][style*="background: #0b3d1d"] {
    width: 100% !important;
    justify-content: center !important;
  }

  /* Footer → 2 column grid */
  footer [style*="grid-template-columns"] {
    grid-template-columns: 1fr 1fr !important;
    gap: 28px !important;
  }

  /* Flex rows → stack */
  [style*="display:flex"][style*="flex-direction:row"],
  [style*="display: flex"][style*="flex-direction: row"] {
    flex-direction: column !important;
  }

  body { overflow-x: hidden !important; max-width: 100vw !important; }
  img { max-width: 100% !important; height: auto !important; }
  table { display: block; overflow-x: auto; white-space: nowrap; }
}

@media (max-width: 480px) {
  [style*="font-size: 30px"], [style*="font-size:30px"] { font-size: 24px !important; }
  [style*="font-size: 28px"], [style*="font-size:28px"] { font-size: 22px !important; }
  [style*="font-size: 24px"], [style*="font-size:24px"] { font-size: 20px !important; }
  [style*="font-size: 22px"], [style*="font-size:22px"] { font-size: 18px !important; }
  [style*="gap: 20px"], [style*="gap:20px"] { gap: 12px !important; }
  [style*="grid-template-columns: repeat(2"] { grid-template-columns: 1fr !important; }
  [style*="grid-template-columns: repeat(4"] { grid-template-columns: 1fr 1fr !important; }
  [style*="display:flex"][style*="flex-direction:row"],
  [style*="display: flex"][style*="flex-direction: row"] {
    flex-direction: column !important;
  }
}