/* Responsive layout */
@media (max-width: 1024px) {
  .benefits { grid-template-columns: repeat(3, 1fr); }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .example-grid { grid-template-columns: repeat(2, 1fr); }
  .card-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 860px) {
  .nav-desktop { display: none; }
  .menu-toggle { display: inline-flex; }
  .converter-grid {
    grid-template-columns: 1fr;
  }
  .editor-pane { border-right: none; border-bottom: 1px solid var(--border-subtle); }
  .editor-pane:last-child { border-bottom: none; }
  .converter-meta { grid-template-columns: 1fr; }
  .meta-block { border-right: none; border-bottom: 1px solid var(--border-subtle); }
  .meta-block:last-child { border-bottom: none; }
  .cg-picker-layout { grid-template-columns: 1fr; }
  .cg-sv { max-width: 280px; }
}

@media (max-width: 640px) {
  .benefits { grid-template-columns: 1fr 1fr; }
  .steps { grid-template-columns: 1fr; }
  .example-grid { grid-template-columns: 1fr; }
  .card-grid { grid-template-columns: 1fr; }
  .use-cases { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .converter-toolbar {
    grid-template-columns: 1fr;
    justify-items: stretch;
  }
  .toolbar-left,
  .toolbar-center,
  .toolbar-right {
    justify-content: center;
  }
  .hero { padding-top: 1.25rem; }
  .brand-text { font-size: 0.95rem; }
  .btn-chrome-header span { display: none; }
  .btn-chrome-header { padding: 0.45rem; }
  .chrome-promo-inner { flex-direction: column; align-items: flex-start; }
  .chrome-sticky-wrap {
    top: auto;
    bottom: 96px;
    right: 18px;
    transform: none;
  }
  .chrome-sticky-btn {
    writing-mode: horizontal-tb;
    text-orientation: mixed;
    border-radius: 999px;
    padding: 12px 16px;
    border: 0;
    box-shadow: 0 6px 22px rgba(2, 132, 199, 0.4);
    animation: none;
  }
  .chrome-sticky-btn:hover { padding: 12px 16px; }
  .chrome-sticky-btn svg { transform: none; }
  [dir="rtl"] .chrome-sticky-wrap {
    right: auto;
    left: 18px;
  }
  [dir="rtl"] .chrome-sticky-btn {
    border-radius: 999px;
    border: 0;
    box-shadow: 0 6px 22px rgba(2, 132, 199, 0.4);
  }
}

@media (max-width: 400px) {
  .benefits { grid-template-columns: 1fr; }
}