/* ==============================================
   INSTAFYHUB — RESPONSIVE STYLESHEET
   Mobile breakpoints for all pages
   ============================================== */

/* ── 1024px — Tablet ─────────────────────────── */
@media (max-width: 1024px) {
  .hero-inner          { grid-template-columns: 1fr; gap: 48px; }
  .hero-section        { padding-top: 64px; }
  .stats-strip         { padding: 28px 32px; }
  .stat-num            { font-size: 28px; }
  .intro-layout        { grid-template-columns: 1fr; gap: 48px; }
  .packages-grid       { grid-template-columns: repeat(2, 1fr); }
  .why-grid            { grid-template-columns: repeat(2, 1fr); }
  .hiw-grid            { grid-template-columns: repeat(2, 1fr); gap: 40px; }
  .hiw-connector       { display: none; }
  .features-grid       { grid-template-columns: repeat(2, 1fr); }
  .benefits-layout     { grid-template-columns: 1fr; }
  .benefits-cta-box    { position: static; }
  .safety-layout       { grid-template-columns: 1fr; gap: 48px; }
  .footer-grid         { grid-template-columns: 1fr 1fr; gap: 32px; }
}

/* ── 768px — Mobile ──────────────────────────── */
@media (max-width: 768px) {
  /* Nav */
  .nav-links, .nav-right { display: none; }
  .hamburger             { display: flex; }

  /* Sections */
  .section    { padding: 56px 0; }
  .section-sm { padding: 48px 0; }

  /* Hero */
  .hero-section { padding-top: 40px; }
  .hero-h1      { font-size: clamp(26px, 7vw, 40px); }
  .hero-desc    { font-size: 15px; }
  .hero-inner   { gap: 36px; }
  .hero-cta-row { flex-direction: column; }
  .hero-cta-row .btn { justify-content: center; width: 100%; }
  .trust-highlights   { grid-template-columns: 1fr 1fr; }

  /* Stats strip */
  .stats-strip { padding: 20px 16px; border-radius: var(--r-md) var(--r-md) 0 0; margin-top: 48px; }
  .stats-inner { grid-template-columns: repeat(2,1fr); gap: 0; }
  .stat-item + .stat-item { border-left: none; }
  .stat-item:nth-child(odd) { border-right: 1px solid rgba(255,255,255,0.08); }
  .stat-item  { padding: 14px 10px; }
  .stat-num   { font-size: 26px; }

  /* Packages / Plans */
  .packages-grid { grid-template-columns: 1fr; }
  .pkg-card.featured, .plan-card.featured { order: -1; }

  /* Why / HIW / Features */
  .why-grid      { grid-template-columns: 1fr 1fr; }
  .hiw-grid      { grid-template-columns: 1fr; gap: 32px; }
  .hiw-item      { padding: 0 12px; }
  .features-grid { grid-template-columns: 1fr; }

  /* Cards */
  .order-card      { padding: 22px 18px; }
  .benefits-cta-box { padding: 26px 20px; }
  .safety-trust    { padding: 26px 20px; }

  /* Section headers */
  .sh      { margin-bottom: 32px; }
  .sh-sub  { font-size: 15px; }
  h2       { font-size: clamp(22px, 5.5vw, 36px); }

  /* CTA */
  .cta-section     { padding: 72px 0; }
  .cta-inner h2    { font-size: clamp(22px, 6vw, 36px); }
  .cta-inner p     { font-size: 15px; }
  .cta-btn-row     { flex-direction: column; align-items: center; }
  .cta-btn-row .btn { width: 100%; max-width: 340px; justify-content: center; }

  /* SEO */
  .seo-content h2 { font-size: 22px; }

  /* Footer */
  .footer-grid   { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .footer-legal  { justify-content: center; flex-wrap: wrap; }
}

/* ── 480px — Small Mobile ────────────────────── */
@media (max-width: 480px) {
  .container   { padding: 0 16px; }
  .section     { padding: 48px 0; }
  .stat-num    { font-size: 22px; }
  .stat-desc   { font-size: 11px; }
  .why-grid    { grid-template-columns: 1fr; }
  .trust-highlights { grid-template-columns: 1fr; }
  .cta-micro   { flex-direction: column; align-items: center; gap: 10px; }
  .hiw-num     { width: 54px; height: 54px; font-size: 20px; }
  .pkg-price   { font-size: 30px; }
  .benefits-layout { gap: 40px; }
  .safety-layout   { gap: 36px; }
  .footer-legal    { gap: 14px; }
  .nav-logo        { font-size: 19px; }
  .breadcrumb-inner { font-size: 12px; }
}