/* ═══════════════════════════════════════════════════
   PenScan — Responsive Styles
   ═══════════════════════════════════════════════════ */

/* ── Tablet: ≤ 1024px ───────────────────────────── */
@media (max-width: 1024px) {
  .features-grid     { grid-template-columns: repeat(2, 1fr); }
  .use-cases-grid    { grid-template-columns: repeat(2, 1fr); }
  .testimonials-grid { grid-template-columns: repeat(2, 1fr); }
  .pricing-grid      { grid-template-columns: repeat(2, 1fr); }
  .footer__grid      { grid-template-columns: 1fr 1fr; gap: var(--space-10); }
  .benefits-layout   { gap: var(--space-10); }
  .hero__content { grid-template-columns: 1fr; }
  .hero__visual { display: none; }
  .stats-row         { grid-template-columns: repeat(2, 1fr); }
  /* Blog */
  .blog-grid         { grid-template-columns: repeat(2, 1fr); }
  .feat-post         { grid-template-columns: 1fr; }
  .article-wrap      { grid-template-columns: 1fr; }
  .art-sidebar       { position: static; }
}

/* ── Large mobile: ≤ 768px ──────────────────────── */
@media (max-width: 768px) {
  :root { --nav-height: 60px; }

  .section      { padding-block: var(--space-16); }
  .section--lg  { padding-block: var(--space-20); }

  /* Nav */
  .nav__links         { display: none; }
  .navbar__actions    { display: none; }
  .mobile-menu-btn    { display: flex; }
  .mobile-nav         { display: flex; }

  /* Hero */
  .hero { min-height: auto; padding-bottom: var(--space-12); }
  .hero__content { padding: var(--space-12) var(--space-6); grid-template-columns: 1fr; }
  .hero__visual { display: none; }
  .hero__headline { font-size: 2.6rem; }
  .hero__sub { max-width: 100%; }
  .hero__actions { flex-direction: column; align-items: stretch; }
  .hero__actions .btn { justify-content: center; }
  .hero__proof { gap: var(--space-2); flex-wrap: wrap; }
  .hero__proof-sep { display: none; }

  /* Grids → 1 col */
  .features-grid     { grid-template-columns: 1fr; }
  .use-cases-grid    { grid-template-columns: 1fr; }
  .testimonials-grid { grid-template-columns: 1fr; }
  .pricing-grid      { grid-template-columns: 1fr; }
  .security-grid     { grid-template-columns: 1fr; }
  .benefits-layout   { grid-template-columns: 1fr; }
  .benefits-layout--reverse { direction: ltr; }
  .stats-row         { grid-template-columns: repeat(2, 1fr); gap: var(--space-6); }

  /* Inline-styled grids on About / Pricing / Contact pages */
  [style*="grid-template-columns:repeat(4,1fr)"],
  [style*="grid-template-columns:repeat(4, 1fr)"] { grid-template-columns: repeat(2,1fr) !important; }
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns:repeat(3, 1fr)"] { grid-template-columns: 1fr !important; }
  [style*="grid-template-columns:1fr 380px"] { grid-template-columns: 1fr !important; }

  /* Footer */
  .footer__grid      { grid-template-columns: 1fr; gap: var(--space-8); }
  .footer__bottom    { flex-direction: column; align-items: flex-start; gap: var(--space-3); }

  /* Trust bar */
  .trust-bar__inner { gap: var(--space-6); }

  /* FAQ */
  .faq__question { padding: var(--space-4) var(--space-5); }
  .faq__answer-inner { padding: 0 var(--space-5) var(--space-4); }

  /* CTA */
  .cta-actions { flex-direction: column; align-items: stretch; }
  .cta-actions .btn { justify-content: center; }

  /* Pricing card badge needs more room */
  .pricing-card--featured { margin-top: var(--space-4); }

  /* Scanner strip */
  .scanner-strip { gap: var(--space-2); }

  /* Blog */
  .blog-grid     { grid-template-columns: 1fr; }
  .cat-tabs      { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch;
                   padding-bottom: var(--space-2); scrollbar-width: none; }
  .cat-tabs::-webkit-scrollbar { display: none; }
  .cat-tab       { flex-shrink: 0; }
  .newsletter    { flex-direction: column; align-items: flex-start; }
  .newsletter__form { flex-direction: column; width: 100%; }
  .nl-input      { width: 100%; }
}

/* ── Small mobile: ≤ 480px ──────────────────────── */
@media (max-width: 480px) {
  .container    { padding-inline: var(--space-4); }
  /* Blog */
  .blog-section { padding-inline: var(--space-4); }
  .blog-hero    { padding-inline: var(--space-4); }
  .article-hero { padding-inline: var(--space-4); }
  .article-wrap { padding-inline: var(--space-4); }

  h1 { font-size: 2.25rem; }

  .hero__headline { font-size: 2.25rem; }
  .hero__sub      { font-size: var(--text-base); }
  .hero__easy-steps { gap: var(--space-3); flex-wrap: wrap; }
  .hero__step-arr { display: none; }

  .feature-card { padding: var(--space-6); }
  .pricing-card { padding: var(--space-6); }

  .stats-row { grid-template-columns: 1fr 1fr; }

  /* Collapse 4-col → 1-col and contact name row → 1-col */
  [style*="grid-template-columns:repeat(4,1fr)"],
  [style*="grid-template-columns:repeat(4, 1fr)"] { grid-template-columns: 1fr !important; }
  [style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; }

  .trust-bar__inner { flex-direction: column; align-items: flex-start; gap: var(--space-4); padding-inline: var(--space-4); }

  .footer__legal { flex-wrap: wrap; gap: var(--space-3); }

  .mobile-nav__actions { flex-direction: column; }
}

/* ── Wide / ultrawide: ≥ 1440px ─────────────────── */
@media (min-width: 1440px) {
  .container { padding-inline: var(--space-8); }
  .features-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ── Print ──────────────────────────────────────── */
@media print {
  .navbar, .mobile-nav, .cta-section { display: none; }
  body { background: white; color: black; }
}

/* ── Reduced motion ─────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html { scroll-behavior: auto; }
  .reveal-init { opacity: 1 !important; transform: none !important; }
}
