/* Tablet tweaks (768px–1024px)
   Keeps desktop look but improves card readability and spacing.
*/

@media (min-width: 768px) and (max-width: 1024px) {
  :root {
    --pad: 32px;
  }

  /* Global section padding: reduce huge desktop paddings */
  .section,
  .about,
  .services,
  .process,
  .openclaw,
  .contact {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }

  .about { padding-top: 110px !important; padding-bottom: 110px !important; }
  .services { padding-top: 110px !important; padding-bottom: 110px !important; }
  .process { padding-top: 110px !important; padding-bottom: 110px !important; }
  .openclaw { padding-top: 110px !important; padding-bottom: 110px !important; }

  /* ABOUT rows: split -> single column for readability */
  .about__row--split {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
  .about__big-title { font-size: 52px !important; }

  /* SERVICES: keep tabs UX but make cards wider */
  .services__tabs {
    grid-template-columns: 260px 1fr !important;
    gap: 22px !important;
  }
  .services__tabs-content { max-width: 100% !important; }
  .panel__card { padding: 32px !important; }
  .panel__features { gap: 12px 18px !important; }

  /* PROCESS: 2 columns on landscape, 1 column on portrait-ish */
  .process__steps { max-width: 100% !important; }
  .step { padding: 34px !important; }
  .step__num { font-size: 58px !important; }
  .step h4 { font-size: 22px !important; }

  @media (max-width: 820px) {
    .process__steps { grid-template-columns: 1fr !important; }
  }

  /* OPENCLAW: system cards -> 1 column on smaller tablet */
  .openclaw__systems {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  /* PACKS: make them readable on tablet */
  .packs__inline { margin-top: 48px !important; padding-top: 40px !important; }
  .packs__grid,
  .packs__grid--2 {
    grid-template-columns: 1fr 1fr !important;
    max-width: 100% !important;
    gap: 18px !important;
  }
  .pack {
    padding: 34px 28px !important;
    border-radius: 18px !important;
  }
  .pack__name { font-size: 24px !important; }
  .pack__desc { font-size: 14px !important; }
  .pack__features li { font-size: 14px !important; padding: 9px 0 9px 22px !important; }

  /* portrait iPad: 1 column to avoid cramped cards */
  @media (max-width: 860px) {
    .packs__grid,
    .packs__grid--2 {
      grid-template-columns: 1fr !important;
      max-width: 620px !important;
      margin-left: auto !important;
      margin-right: auto !important;
    }
  }

  /* FOOTER: fewer columns */
  .footer__top {
    grid-template-columns: 1.4fr 1fr 1fr !important;
  }
}