/* =====================================================================
   NEXORA WEB — responsive.css
   Mobile-first refinements. Loaded last so it overrides base layout.
   ===================================================================== */

/* Tablet / small laptop ------------------------------------------------ */
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .process-steps { grid-template-columns: repeat(2, 1fr); row-gap: var(--space-lg); }
  .process-step:not(:last-child)::after { display: none; }
  .hero__inner { gap: var(--space-lg); }
  .hero__title { font-size: var(--font-size-3xl); }
  .footer__grid { grid-template-columns: 1fr 1fr; }
}

/* Tablet portrait / large phone --------------------------------------- */
@media (max-width: 768px) {
  :root { --space-2xl: 80px; --space-xl: 56px; }

  .nav__links     { display: none; }
  .nav__hamburger { display: flex; }
  .nav__cta       { display: none; }

  .hero {
    padding: 130px 0 var(--space-xl);
  }
  .hero__inner {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .hero__sub { margin-left: auto; margin-right: auto; }
  .hero__ctas, .hero__trust { justify-content: center; }
  .hero__tag { margin-left: auto; margin-right: auto; }
  .hero__visual { display: none; }

  .services-grid { grid-template-columns: 1fr; }
  .pricing-grid  { grid-template-columns: 1fr; }
  .care__grid    { grid-template-columns: 1fr; }
  .price-card--featured { order: -1; }

  .process-steps { grid-template-columns: 1fr; }
  .process-step  { padding-left: var(--space-md); }
  /* vertical dashed connector on mobile */
  .process-step:not(:last-child)::after {
    display: block;
    top: 48px; left: 16px; right: auto; bottom: -32px;
    width: 0;
    border-top: none;
    border-left: 1px dashed var(--border-subtle);
  }

  .about-split { grid-template-columns: 1fr; gap: var(--space-lg); }
  .about__photo { order: -1; }
  .about__photo-frame { max-width: 300px; }

  .faq-grid { grid-template-columns: 1fr; gap: 0; }

  .section-heading { font-size: var(--font-size-2xl); }
  .final-cta__heading { font-size: var(--font-size-2xl); }

  .footer__grid { grid-template-columns: 1fr; gap: var(--space-md); text-align: left; }
  .footer__bottom { flex-direction: column; align-items: flex-start; }

  .addons__table { display: block; overflow-x: auto; }
}

/* Phone ---------------------------------------------------------------- */
@media (max-width: 480px) {
  :root { --container-pad: 16px; }

  .hero__title { font-size: 28px; }
  .hero__trust { gap: var(--space-md); }

  .btn--lg { font-size: var(--font-size-base); padding: 12px 20px; min-height: 48px; }

  .trust-row { gap: var(--space-sm); }
  .trust-row__sep { display: none; }

  .pricing-toggle { width: 100%; }
  .pricing-toggle__btn { flex: 1; }

  .service-card, .price-card { padding: 24px; }

  .notfound__code { font-size: 84px; }

  .hero__ctas .btn { width: 100%; }
  .final-cta .btn { width: 100%; }
}

/* Wider screens: cap hero device so it doesn't overflow ---------------- */
@media (min-width: 1280px) {
  .hero__badge--1 { left: -2%; }
  .hero__badge--2 { right: -2%; }
}