/* =========================================================
   RESPONSIVE RULES
   ========================================================= */

@media (max-width: 1180px){
  .stat-grid, .quick-actions{ grid-template-columns: repeat(2, 1fr); }
  .dashboard-hero h1{ font-size: 34px; }
  .template-grid{ grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 1000px){
  .wizard-body{ flex-direction: column; overflow-y: auto; }
  .wizard-editor{ max-width: 100%; padding: var(--sp-6); overflow-y: visible; }
  .wizard-preview{ display: none; }
  .wizard-preview.is-mobile-visible{ display: block; overflow-y: visible; }
  .wizard-body.preview-mode .wizard-editor{ display: none; }
  .wizard-body.preview-mode .wizard-preview{ display: block; flex: 1; overflow-y: auto; }
  .mobile-tabs{ display: flex !important; }
}

@media (max-width: 768px){
  .app-header{ padding: var(--sp-3) var(--sp-4); }
  .app-header__toolname{ display: none; }
  .app-header__nav{ overflow-x: auto; scrollbar-width: none; }
  .app-header__nav::-webkit-scrollbar{ display: none; }
  .app-header__navlink{ font-size: 12px; padding: var(--sp-2); white-space: nowrap; }
  .dashboard{ padding: var(--sp-6) var(--sp-4) var(--sp-16); }
  .dashboard-hero{ padding: var(--sp-8) var(--sp-6); }
  .dashboard-hero h1{ font-size: 26px; }
  .stat-grid, .quick-actions{ grid-template-columns: 1fr 1fr; }
  .form-grid, .form-grid--3{ grid-template-columns: 1fr; }
  .service-grid{ grid-template-columns: 1fr; }
  .builder-item__body{ grid-template-columns: 1fr; }
  .template-grid{ grid-template-columns: 1fr; }
  .wizard-topbar__title{ max-width: 100px; }
  .wizard-topbar__actions .btn{ padding: 7px 10px; font-size: 12px; }
  .doc-cols{ grid-template-columns: 1fr; }
  .stat-tiles{ grid-template-columns: repeat(2,1fr); }
  .steps-row{ flex-direction: column; }
  .portfolio-grid{ grid-template-columns: 1fr; }
}

@media (max-width: 520px){
  .stat-grid, .quick-actions{ grid-template-columns: 1fr; }
  .wizard-topbar{ flex-wrap: wrap; }
  .review-section__body dl{ grid-template-columns: 1fr; }
  .app-header__nav .app-header__navlink{ display: none; }
}

.mobile-tabs{
  display: none; flex-shrink: 0; background: var(--c-white); border-top: 1px solid var(--surface-border);
  padding: var(--sp-2) var(--sp-4);
}
.mobile-tabs__inner{ display: flex; gap: 6px; background: var(--c-gray-100); border-radius: var(--r-md); padding: 4px; }
.mobile-tabs__btn{
  flex: 1; border: none; background: none; padding: 9px; border-radius: 7px; font-size: 12.5px; font-weight: 700;
  color: var(--c-gray-600); cursor: pointer;
}
.mobile-tabs__btn.is-active{ background: var(--c-black); color: #fff; }
