/* ============================================================
   Responsive
   ============================================================ */

/* tablet */
@media (max-width: 1040px) {
  .hero-grid { grid-template-columns: 1fr !important; }
  .hero-visual-wrap { min-height: 420px !important; order: 2; }
  .ai-head { grid-template-columns: 1fr !important; gap: 22px !important; }
  .cards-3 { grid-template-columns: repeat(2, 1fr) !important; }
  .process-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .steps-row { grid-template-columns: repeat(2, 1fr) !important; gap: 28px !important; }
  .steps-line { display: none !important; }
  .about-grid { grid-template-columns: 1fr !important; }
  .app-card-inner { grid-template-columns: 1fr !important; direction: ltr !important; }
  .app-preview-grid { grid-template-columns: 1fr !important; }
  .app-hero-top { grid-template-columns: 1fr !important; }
  .app-hero-phones { min-height: 420px !important; order: 2; }
  .explorer-grid { grid-template-columns: 1fr !important; }
  .explorer-phone-wrap { order: 2; }
  .feat-grid { grid-template-columns: 1fr 1fr !important; }
  .contact-grid { grid-template-columns: 1fr !important; }
  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr !important; }
  .footer-grid > div:nth-child(4) { grid-column: 1 / -1; }
}

/* mobile nav */
@media (max-width: 1024px) {
  .nav-desktop { display: none !important; }
  .cta-desktop { display: none !important; }
  .nav-burger { display: flex !important; }
}

/* phone */
@media (max-width: 680px) {
  :root { --gutter: 18px; --header-h: 66px; }
  .cards-3 { grid-template-columns: 1fr !important; }
  .process-grid { grid-template-columns: 1fr !important; }
  .steps-row { grid-template-columns: 1fr !important; gap: 22px !important; }
  .metrics-row { grid-template-columns: repeat(2, 1fr) !important; }
  .cs-split, .cs-shots { grid-template-columns: 1fr !important; }
  .footer-grid { grid-template-columns: 1fr 1fr !important; }
  .footer-grid > div:first-child { grid-column: 1 / -1; }
  .ai-timeline .glass { grid-template-columns: 1fr !important; gap: 6px !important; }
  .app-features { grid-template-columns: 1fr !important; }
  .app-preview-icons { justify-content: flex-start; }
  .showcase-cta { width: 100%; justify-content: center; }
  .feat-grid { grid-template-columns: 1fr !important; }
  .feat-panel { min-height: 300px !important; }
  .ai-stats { grid-template-columns: 1fr !important; gap: 20px !important; }
  .terappin-hero { grid-template-columns: 1fr !important; }
  .tweb-grid { grid-template-columns: 1fr !important; }
  .tchanged { grid-template-columns: 1fr !important; }
  .tgov { grid-template-columns: 1fr !important; gap: 18px !important; }
  .tgov-list { grid-template-columns: 1fr !important; }
  .nebula-hero { grid-template-columns: 1fr !important; }
  .nebula-split { grid-template-columns: 1fr !important; }
  .nebula-order-2 { order: 2; }
  .nebula-admin { grid-template-columns: 1fr !important; }
  .nfeat { grid-template-columns: 1fr !important; }
  .netron-hero { grid-template-columns: 1fr !important; }
  .netron-split { grid-template-columns: 1fr !important; }
  .netron-order-2 { order: 2; }
  .netron-int { grid-template-columns: 1fr !important; }
  .ntfeat { grid-template-columns: 1fr !important; }
  .radexa-hero { grid-template-columns: 1fr !important; }
  .radexa-split { grid-template-columns: 1fr !important; }
  .radexa-order-2 { order: 2; }
  .radexa-stats { grid-template-columns: 1fr !important; }
  .rxfeat { grid-template-columns: 1fr !important; }
  .rxgov { grid-template-columns: 1fr !important; gap: 18px !important; }
  .rxgov-list { grid-template-columns: 1fr !important; }
  .varan-hero { grid-template-columns: 1fr !important; }
  .varan-split { grid-template-columns: 1fr !important; }
  .varan-steps { grid-template-columns: 1fr 1fr !important; }
  .vrfeat { grid-template-columns: 1fr !important; }
  .varan-review { grid-template-columns: 1fr !important; }
  .jetbee-hero { grid-template-columns: 1fr !important; }
  .jetbee-split { grid-template-columns: 1fr !important; }
  .jetbee-order-2 { order: 2; }
  .ping-hero { grid-template-columns: 1fr !important; }
  .ping-split { grid-template-columns: 1fr !important; }
  .ping-order-2 { order: 2; }
  .ppfeat { grid-template-columns: 1fr !important; }
  .cw-hero { grid-template-columns: 1fr !important; }
  .cw-split { grid-template-columns: 1fr !important; }
  .cw-order-2 { order: 2; }
  .cwfeat { grid-template-columns: 1fr !important; }
  .ai-hero-grid { grid-template-columns: 1fr !important; }
  .ai-hero-core-wrap { order: -1; max-width: 320px; margin: 0 auto; }
  .ai-bento { grid-template-columns: 1fr !important; }
  .ai-bento-cell { grid-column: auto !important; }
  .ngov { grid-template-columns: 1fr !important; gap: 18px !important; }
  .ngov-list { grid-template-columns: 1fr !important; }
  .app-list { flex-direction: column; align-items: stretch; }
  .app-list-side { align-items: flex-start; flex-direction: row; flex-wrap: wrap; justify-content: space-between; width: 100%; }
  .spotlight-fan { overflow-x: auto; overflow-y: hidden; justify-content: flex-start; padding-bottom: 16px; scrollbar-width: none; }
  .spotlight-fan::-webkit-scrollbar { display: none; }
  .spotlight-fan .phone-frame, .app-spotlight:hover .spotlight-fan .phone-frame { margin: 0 7px !important; transform: none !important; }
  .contact-grid form { grid-template-columns: 1fr !important; }
  /* blog featured -> stack */
  .blog-featured { flex-direction: column !important; }
  .blog-featured .cover { width: 100% !important; }
  .display { font-size: clamp(34px, 11vw, 52px) !important; }
  .hero-visual { min-height: 380px !important; }
  .float-card { transform: scale(0.82); }
}

@media (max-width: 420px) {
  .metrics-row { grid-template-columns: 1fr 1fr !important; }
  .float-card { transform: scale(0.7); }
}