/* ─────────────────────────────────────────────
       MOBILE
    ───────────────────────────────────────────── */
    @media (max-width: 1100px) {
      .right-nav-wrap { display: none; }
    }
    @media (max-width: 768px) {
      :root { --sidebar-w: 0px; }
      /* Header */
      .hamburger { display: flex !important; }
      .header-logo { min-width: auto; }
      .header-search { display: none; }
      /* Sidebar: completely hidden — JS adds .open for full-screen overlay */
      .sidebar {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        z-index: 300 !important;
        transform: none !important;
        display: none !important;
        border-right: none !important;
        padding-top: calc(var(--header-h) + 1rem) !important;
        overflow-y: auto !important;
        visibility: visible !important;
        background: var(--bg) !important;
      }
      .sidebar.open {
        display: block !important;
      }
      /* Overlay backdrop not needed — sidebar IS full screen */
      .sidebar-overlay { display: none !important; }
      /* Main: no margin, full width, readable padding */
      .main { margin-left: 0 !important; }
      .content-wrap {
        padding: 2rem 1.25rem 5rem !important;
        max-width: 100% !important;
      }
      /* Typography */
      .content-title { font-size: clamp(1.4rem, 5vw, 2rem) !important; }
      .content-lead { font-size: 0.95rem !important; }
      h2 { font-size: 1.15rem !important; }
      h3 { font-size: 1rem !important; }
      /* Grids → single column */
      .feature-grid,
      .steps-grid,
      .two-col,
      .beings-grid,
      .products-grid {
        grid-template-columns: 1fr !important;
      }
      /* Flex → stack */
      .formula-steps { flex-direction: column !important; }
      .page-nav { flex-direction: column !important; gap: 0.75rem !important; }
      .page-nav-btn { width: 100% !important; justify-content: center !important; }
      /* Close button inside sidebar on mobile */
      .sidebar-close-btn { display: flex !important; }
      /* Misc */
      .video-placeholder { height: 200px !important; }
      .callout { font-size: 0.875rem !important; }
      .code-block pre { font-size: 0.8rem !important; overflow-x: auto !important; }
      .right-nav-wrap { display: none !important; }
      .breadcrumb { font-size: 0.75rem !important; }
    }
    @media (max-width: 480px) {
      .content-wrap { padding: 1.5rem 1rem 4rem !important; }
      .content-title { font-size: 1.3rem !important; }
      .feature-card, .step-card, .being-card, .info-card { padding: 1rem !important; }
    }