/* Quick Recipes — responsive */

@media (max-width: 1100px) {
  .hero__split { gap: 36px; }
  .hero__title { font-size: 4.4rem; }
}

/* ---------- tablet / mobile-menu breakpoint ---------- */
@media (max-width: 991px) {
  .title { font-size: 3.4rem; }
  .title-big { font-size: 4.2rem; }

  /* header → hamburger + off-canvas */
  .header-inner { justify-content: space-between; padding: 1rem 1.6rem; }
  .toggle-menu { display: flex; order: 3; }
  .site-mobile-logo { display: inline-flex; }
  .site-mobile-logo .sticky-logo { display: none; }

  .site-nav {
    position: fixed;
    top: 0; left: 0;
    height: 100%;
    width: 290px;
    max-width: 84vw;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 26px 24px;
    background: #fff;
    box-shadow: 0 20px 60px rgba(16, 80, 40, 0.24);
    transform: translateX(-100%);
    transition: transform .3s ease;
    z-index: 100;
    overflow-y: auto;
  }
  html.sidebar-open .site-nav { transform: translateX(0); }
  html.no-scroll { overflow: hidden; }

  .site-logo { margin-right: 0; margin-bottom: 10px; }
  .close-menu { display: block; align-self: flex-end; cursor: pointer; color: var(--muted); font-weight: 600; margin-bottom: 6px; }
  .menu-wrapper { width: 100%; }
  .site-main-menu { flex-direction: column; align-items: stretch; gap: 2px; width: 100%; }
  .site-main-menu li > a { display: block; padding: 1.1rem 1.4rem; }
  .site-nav > .btn { width: 100%; margin-top: 14px; }

  /* hero */
  .hero { padding: 3.5rem 0 4.5rem; }
  .hero__split { grid-template-columns: 1fr; gap: 40px; text-align: center; }
  .hero__title { font-size: 4rem; }
  .hero__subtitle { margin-left: auto; margin-right: auto; }
  .hero__cta, .hero__trust { justify-content: center; }
  .hero__visual { order: -1; max-width: 560px; margin: 0 auto; width: 100%; }

  /* howto → stacked, arrows rotate */
  .howto__row { flex-direction: column; align-items: center; gap: 0; }
  .howto-step { max-width: 460px; width: 100%; }
  .howto-step__head { min-height: 0; }
  .howto-arrow { flex: 0 0 auto; padding: 14px 0; transform: rotate(90deg); }

  /* grids collapse */
  .cmds__grid, .why__grid { grid-template-columns: 1fr; gap: 32px; }
}

@media (max-width: 767px) {
  .title { font-size: 3rem; }
  .hero__title { font-size: 3.4rem; }
  .howto__title, .cmds__title, .why__title, .cta__title { font-size: 2.8rem; }
  .why__list { grid-template-columns: 1fr; }
  .qr-recipe__title { font-size: 1.4rem; }
  .cmds__row { flex-wrap: wrap; }
  .cmds__arrow { display: none; }
  .footer-wrapper { flex-direction: column; align-items: flex-start; }
  .footer-nav-wrapper { gap: 36px; }
}

@media (max-width: 575px) {
  .container { padding: 0 18px; }
  .hero__title { font-size: 3rem; }
  .hero__cta { flex-direction: column; align-items: stretch; }
  .hero__cta .btn, .hero__cta .btn_ghost { justify-content: center; }
  .qr-serp__query { flex-direction: column; align-items: flex-start; gap: 4px; }
  .cta__panel { padding: 3.6rem 1.8rem; }
  .cta__title { font-size: 2.6rem; }
  .contact-card { padding: 2.4rem; min-height: 0; }
  .terms-privacy { padding: 2.4rem 0; }
}

@media (max-width: 480px) {
  .hero__title { font-size: 2.7rem; }
  .qr-browser__body { padding: 16px; }
  .footer-nav-wrapper { flex-direction: column; gap: 6px; }
}