/* Hustle Empire - Mobile Responsive Fixes */
/* Tablet: 768px and below */
@media (max-width: 768px) {
  /* Nav */
  .lp-nav { padding: 12px 16px !important; flex-wrap: wrap !important; gap: 8px !important; }
  .lp-nav-links { display: none !important; }
  .lp-nav-ctas { gap: 8px !important; }
  .lp-nav-ctas .lp-btn-ghost { padding: 8px 14px !important; font-size: 13px !important; }
  .lp-nav-ctas a[class*="btn"], .lp-nav-ctas button { padding: 8px 16px !important; font-size: 13px !important; }

  /* Hero */
  .lp-hero { padding: 40px 16px !important; }
  .lp-hero-h1 { font-size: 32px !important; line-height: 1.15 !important; }
  .lp-hero-sub { font-size: 15px !important; padding: 0 8px !important; }
  .lp-hero-ctas { flex-direction: column !important; gap: 12px !important; align-items: stretch !important; }
  .lp-hero-ctas a, .lp-hero-ctas button { width: 100% !important; text-align: center !important; }
  .lp-hero-grid { grid-template-columns: 1fr !important; }
  .lp-hero-stats { flex-wrap: wrap !important; gap: 12px !important; justify-content: center !important; }
  .lp-hero-bg { display: none !important; }

  /* Sections */
  .lp-section { padding: 48px 16px !important; }
  .lp-section-h2 { font-size: 26px !important; line-height: 1.2 !important; }
  .lp-section-sub { font-size: 14px !important; padding: 0 8px !important; }
  .lp-section-eyebrow { font-size: 12px !important; }

  /* Tool grid */
  .lp-tool-grid, [class*="tool-grid"] { grid-template-columns: 1fr !important; gap: 16px !important; }
  .lp-tool, [class*="tool-card"] { padding: 20px 16px !important; }

  /* Plans / Pricing */
  .lp-plans, .lp-plan-grid, [class*="plan-grid"], [class*="plans"] { 
    grid-template-columns: 1fr !important; 
    gap: 24px !important; 
  }
  .lp-plan { padding: 24px 18px !important; }
  .lp-plan-price { font-size: 36px !important; }
  .lp-plan-name { font-size: 18px !important; }
  .lp-plan-desc { font-size: 13px !important; }
  .lp-plan-feat { font-size: 13px !important; }
  .lp-plan-btn, .lp-plan-btn-gold, .lp-plan-btn-outline { 
    padding: 12px !important; 
    font-size: 14px !important; 
    width: 100% !important; 
  }

  /* Steps */
  .lp-step-grid, [class*="step-grid"], [class*="steps-grid"] { 
    grid-template-columns: 1fr 1fr !important; 
    gap: 16px !important; 
  }
  .lp-step { padding: 16px !important; }
  .lp-step-num { font-size: 20px !important; }
  .lp-step-title { font-size: 15px !important; }
  .lp-step-desc { font-size: 12px !important; }

  /* Reviews */
  .lp-review-grid, [class*="review-grid"] { grid-template-columns: 1fr !important; gap: 16px !important; }

  /* FAQ */
  .lp-faq { padding: 0 8px !important; }
  .lp-faq-q { font-size: 15px !important; padding: 14px 12px !important; }
  .lp-faq-a { font-size: 13px !important; padding: 12px !important; }

  /* Footer */
  .lp-footer { padding: 32px 16px !important; }
  .lp-footer-links { flex-direction: column !important; gap: 8px !important; text-align: center !important; }

  /* Toggle */
  [class*="toggle-wrap"], [class*="billing-toggle"] { flex-wrap: wrap !important; justify-content: center !important; gap: 10px !important; }

  /* Auth screen */
  .auth-left, .auth-right { width: 100% !important; min-width: 0 !important; }
  .auth-feature-panel { display: none !important; }
  [class*="auth-screen"], [class*="auth-overlay"] { 
    flex-direction: column !important; 
    padding: 16px !important; 
  }

  /* General overflow prevention */
  *, *::before, *::after { max-width: 100vw !important; box-sizing: border-box !important; }
  body { overflow-x: hidden !important; }
  img, video, iframe, canvas, svg { max-width: 100% !important; height: auto !important; }
  pre, code { overflow-x: auto !important; white-space: pre-wrap !important; word-break: break-word !important; }

  /* Grids that might be fixed-column */
  [style*="grid-template-columns: repeat(4"], 
  [style*="grid-template-columns: repeat(3"],
  [style*="grid-template-columns:repeat(4"],
  [style*="grid-template-columns:repeat(3"] {
    grid-template-columns: 1fr !important;
  }

  /* Two-column layouts */
  .home-2col, [class*="2col"], .fc-col { 
    grid-template-columns: 1fr !important; 
    flex-direction: column !important; 
  }

  /* Forecast / dashboard grids */
  .dash-grid, .forecast-row { 
    grid-template-columns: 1fr !important; 
    flex-direction: column !important; 
  }

  /* Banner text */
  [class*="banner"] { font-size: 13px !important; padding: 8px 12px !important; }
}
/* Phone: 480px and below */
@media (max-width: 480px) {
  .lp-hero-h1 { font-size: 26px !important; }
  .lp-hero-sub { font-size: 14px !important; }
  .lp-section-h2 { font-size: 22px !important; }
  .lp-plan-price { font-size: 32px !important; }
  .lp-step-grid, [class*="step-grid"] { grid-template-columns: 1fr !important; }
  .lp-nav-brand img { max-width: 36px !important; height: auto !important; }
  .lp-hero-stats { flex-direction: column !important; align-items: center !important; }
  .lp-hero-ctas a, .lp-hero-ctas button { font-size: 15px !important; padding: 14px !important; }
}

/* Small phone: 380px and below */
@media (max-width: 380px) {
  .lp-hero-h1 { font-size: 22px !important; }
  .lp-section-h2 { font-size: 20px !important; }
  .lp-nav { padding: 10px 12px !important; }
  .lp-nav-ctas .lp-btn-ghost { display: none !important; }
}